Skip to content

Ellipse shapes (using A(-description-) are broken in flowcharts #5976

@aloisklink

Description

@aloisklink

Description

Mermaid has syntax for ellipse shapes in flowcharts, e.g. by doing:

```mermaid
graph TD
  A(-My ellipse shape-)
```

However, it looks like the new default flowchart renderer in Mermaid v9.2.0 broke this.

Steps to reproduce

Try copying the above diagram into the mermaid live editor, or any other mermaid environment.

Screenshots

For example, the following diagram renders like the following using Mermaid 9.1.7, but fails in Mermaid 9.2.0 (unless we set flowchart: { defaultRenderer: 'dagre-d3' } in the config:

            graph TD 
              good(-My ellipse shape-)
              pill([My pill shape])

image

Code Sample

No response

Setup

  • Mermaid version: Since v9.2.0
  • Browser and Version: [Chrome, Edge, Firefox]

Suggested Solutions

The easiest way to fix this would probably be to add the ellipse shape back into: https://github.com/mermaid-js/mermaid/blob/9afb181d064c45abd870e43a6765029e16bd6e39/packages/mermaid/src/rendering-util/rendering-elements/shapes.ts

I believe previously, the ellipse was drawn using dagre-d3's ellipse shape: https://github.com/dagrejs/dagre-d3/blob/6cccb322003a43c30b29019b9ec43885e99aa4a6/lib/shapes.js#L31-L45

Although, we could also remove support for ellipse shapes, considering nobody seems to have noticed that it broke, and that documentation for the ellipse shape was never added (see #274 (comment)).

Additional Context

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions