Skip to content

Buggy rendering differences between live and playground #6576

@ArashPartow

Description

@ArashPartow

Description

There seems to be an annoying difference in rendering labels on edges in state diagrams between playground and live.

I think in both cases the label location is computed in a similar way, however in playground, the edge is curvier, which means it doesn't approach the label.

Seeing the same thing with Chrome and Firefox with most recent versions as of 20250508.

Steps to reproduce

The following are the two different renderings I'm seeing:

Image

Image

Screenshots

No response

Code Sample

Here is the mermaid syntax:


---
title: On The Way To Something Something DarkSide
config:
  look: default
  theme: default
---

stateDiagram-v2

   state State1_____________
   {
      c0
   }

   state State2_____________
   {
      c1
   }

   state State3_____________
   {
      c7
   }

   state State4_____________
   {
      c2
   }

   state State5_____________
   {
      c3
   }

   state State6_____________
   {
      c4
   }

   state State7_____________
   {
      c5
   }

   state State8_____________
   {
      c6
   }


[*] --> State1_____________
State1_____________ --> State2_____________   : Transition1_____
State2_____________ --> State4_____________   : Transition2_____
State2_____________ --> State3_____________   : Transition3_____
State3_____________ --> State2_____________
State4_____________ --> State2_____________   : Transition5_____
State4_____________ --> State5_____________   : Transition6_____
State5_____________ --> State6_____________   : Transition7_____
State6_____________ --> State4_____________   : Transition8_____
State2_____________ --> State7_____________   : Transition4_____
State4_____________ --> State7_____________   : Transition4_____
State5_____________ --> State7_____________   : Transition4_____
State6_____________ --> State7_____________   : Transition4_____
State7_____________ --> State1_____________   : Transition9_____
State5_____________ --> State8_____________   : Transition10____
State8_____________ --> State5_____________   : Transition11____

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions