mermaiddraw.io

Mermaid Style Failure


I am using mermaid to generate a basic UML class diagram with style and import it to draw.io. And I am trying to apply class definition styles to my classes however, I keep getting the error:

Error: Parse error on line 2:
...:primaryColor,stroke:primaryBorderColor,...
-----------------------^
Expecting 'NEWLINE', 'EOF', got 'LABEL'

This is my diagram:

classDiagram
    classDef cleanClass fill:primaryColor,stroke:primaryBorderColor,stroke-width:2px;
    classDef domainClass fill:secondaryColor,stroke:primaryBorderColor,stroke-width:2px;
    
    Animal <|-- Duck : implements
    Animal <|-- Fish : implements
    Animal <|-- Zebra : implements
    
    class Animal {
        +int age
        +String gender
        +isMammal()
        +mate()
    }
    
    class Duck{
        +String beakColor
        +swim()
        +quack()
    }
    
    class Fish{
        -int sizeInFeet
        -canEat()
    }
    
    class Zebra{
        +bool is_wild
        +run()
    }
    
    Animal : type cleanClass
    Duck : type domainClass
    Fish : type domainClass
    Zebra : type domainClass

I have tried different approaches, it seems only the style command works. But I wish I don't have to use this command and be able to use a classDef for this... or any other one definition solution.


Solution

  • Class diagrams do not currently support classDef style commands. Right now the only ways to style class diagrams are detailed here: https://mermaid.js.org/syntax/classDiagram.html#classes

    This is actually something that has been on my "todo" list for awhile now, but have not had time over the past few months to follow up on any of these