Mermaid chart generates syntax error for valid mermaid code. This is consistently happening with code generated and valid for other mermaid diagram generators.
Hi Helloworld!
I saw this recent post in the Lucid community with a Mermaid version number as 10.2.3 - I wonder whether there’s something that Mermaid has changed that is not backward compatible at some point of their versioning process?
In trying to think through how best to go about debugging what you’re seeing …
- Do you have an example of Mermaid code that is failing to generate diagrams in Lucid?
- What are some of the other places that you are seeing Mermaid accept that same Mermaid code?
Below is an example that has syntax error but generates on other interpreters..
graph TD
subgraph "PEOPLE LAYER"
P1("Support Engineers")
P2("Developers")
P3("Product Managers")
P4("QA Team")
P5("End Users")
end
subgraph "PROCESS LAYER"
PR1("Incident Management")
PR2("Problem Management")
PR3("Change Management")
PR4("Release Management")
PR5("Knowledge Management")
PR6("SLA Management")
end
subgraph "DATA LAYER"
D1("Customer Data")
D2("Product Configuration")
D3("Issue Repository")
D4("Knowledge Base")
D5("Performance Metrics")
D6("Historical Data")
end
subgraph "APPLICATION LAYER"
subgraph "Ticketing System"
A1("Ticketing System")
AF1("Incident Logging")
AF2("Root Cause Analysis")
end
subgraph "Monitoring Tools"
A2("Monitoring Tools")
AF5("Performance Monitoring")
end
subgraph "Version Control System"
A3("Version Control System")
AF3("Code Deployment")
AF4("Automated Testing")
end
subgraph "Documentation System"
A4("Documentation System")
end
subgraph "Analytics Dashboard"
A5("Analytics Dashboard")
AF6("Reporting")
end
end
subgraph "INTERFACES LAYER"
I1("User Portal")
I2("Admin Console")
I3("Developer API")
I4("Mobile Interface")
I5("Integration Points")
end
%% Connections between layers
P1 --> PR1
P1 --> PR2
P2 --> PR3
P2 --> PR4
P3 --> PR5
P4 --> PR6
P5 --> PR1
PR1 --> D3
PR2 --> D3
PR3 --> D2
PR4 --> D2
PR5 --> D4
PR6 --> D5
D1 --> A1
D2 --> A3
D3 --> A1
D4 --> A4
D5 --> A5
D6 --> A5
A1 --> I1
A1 --> I2
A2 --> I2
A3 --> I3
A3 --> I5
A4 --> I1
A5 --> I2
A5 --> I4
%% Style classes
classDef people fill:#FFC3A1,stroke:#333,stroke-width:1px
classDef process fill:#D8B4F8,stroke:#333,stroke-width:1px
classDef data fill:#A7D2CB,stroke:#333,stroke-width:1px
classDef application fill:#F8C8DC,stroke:#333,stroke-width:1px
classDef function fill:#F9F5E7,stroke:#333,stroke-width:1px
classDef interface fill:#D3CEDF,stroke:#333,stroke-width:1px
%% Apply styles
class P1,P2,P3,P4,P5 people
class PR1,PR2,PR3,PR4,PR5,PR6 process
class D1,D2,D3,D4,D5,D6 data
class A1,A2,A3,A4,A5 application
class AF1,AF2,AF3,AF4,AF5,AF6 function
class I1,I2,I3,I4,I5 interface
It would be helpful if Lucid returned the actual syntax errors, similar to how https://mermaid.live/ handles it.
Reply
Create an account in the community
A Lucid account is required to interact with the community. You will be redirected to the Lucid app to create an account.
Log in to the community
A Lucid account is required to interact with the community. You will be redirected to the Lucid app to log in.
Log in with Lucid
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.