110 lines
3.6 KiB
Markdown
110 lines
3.6 KiB
Markdown
# Mermaid Diagram Syntax Guide (Antigravity & VS Code Compatible)
|
|
|
|
Both Antigravity and Visual Studio Code (via Markdown preview extensions) natively render Mermaid diagrams. To avoid syntax or parsing errors, follow these strict templates.
|
|
|
|
---
|
|
|
|
## 1. MCD Diagram Template (`flowchart LR` or `flowchart TD`)
|
|
|
|
Merise MCDs represent **Entities** (rectangles) and **Associations** (rounded/ovals) connected by lines labeled with `(min,max)` cardinalities.
|
|
|
|
### Syntax Guidelines
|
|
1. Always quote edge labels containing commas: `---|"1,N"|` (unquoted commas can break Mermaid parsers).
|
|
2. Use `<br/>` for line breaks inside node labels.
|
|
3. Keep entity attributes clean with a separator (`---`).
|
|
4. Association nodes use double parentheses `((Name))` or stadium brackets `([Name])`.
|
|
|
|
### Code Example
|
|
```mermaid
|
|
flowchart LR
|
|
%% ENTITIES
|
|
CUSTOMER["CUSTOMER<br/>-------------------<br/>+ CUS_ID (Identifiant)<br/>- CUS_FIRST_NAME<br/>- CUS_LAST_NAME<br/>- CUS_EMAIL"]
|
|
|
|
ORDER["ORDER<br/>-------------------<br/>+ ORD_ID (Identifiant)<br/>- ORD_DATE<br/>- ORD_TOTAL_AMOUNT"]
|
|
|
|
PRODUCT["PRODUCT<br/>-------------------<br/>+ PRO_ID (Identifiant)<br/>- PRO_NAME<br/>- PRO_PRICE"]
|
|
|
|
%% ASSOCIATIONS
|
|
ASSOC_PASS(["PASSER / PLACE"])
|
|
ASSOC_CONT(["CONTENIR / CONTAIN<br/>-------------------<br/>- ITE_QUANTITY<br/>- ITE_UNIT_PRICE"])
|
|
|
|
%% CARDINALITIES
|
|
CUSTOMER ---|"0,N"| ASSOC_PASS
|
|
ASSOC_PASS ---|"1,1"| ORDER
|
|
|
|
ORDER ---|"1,N"| ASSOC_CONT
|
|
ASSOC_CONT ---|"0,N"| PRODUCT
|
|
|
|
%% STYLING
|
|
classDef entity fill:#e1f5fe,stroke:#0288d1,stroke-width:2px,color:#01579b;
|
|
classDef assoc fill:#fff3e0,stroke:#f57c00,stroke-width:2px,color:#e65100;
|
|
class CUSTOMER,ORDER,PRODUCT entity;
|
|
class ASSOC_PASS,ASSOC_CONT assoc;
|
|
```
|
|
|
|
---
|
|
|
|
## 2. MLD Diagram Template (`erDiagram`)
|
|
|
|
Merise MLDs represent normalized relational tables with explicit types, primary keys (`PK`), and foreign keys (`FK`).
|
|
|
|
### Syntax Guidelines
|
|
1. In Mermaid `erDiagram`, data types must be single tokens without spaces (e.g. `VARCHAR`, `INT`, `DECIMAL`, `TIMESTAMP`, `BOOLEAN`). Do not write `VARCHAR(100)` directly in the type position if your renderer strictly checks tokens; use `VARCHAR` or `VARCHAR_100`.
|
|
2. Always assign `PK` and `FK` flags.
|
|
3. Relationship lines indicate relational cardinality (Crow's Foot notation):
|
|
- `||--o{`: Exactly one to zero or many (1 to 0..N)
|
|
- `||--|{`: Exactly one to one or many (1 to 1..N)
|
|
- `|o--o{`: Zero or one to zero or many (0..1 to 0..N)
|
|
- `||--||`: Exactly one to exactly one (1 to 1)
|
|
|
|
### Code Example
|
|
```mermaid
|
|
erDiagram
|
|
ECO_CUSTOMER {
|
|
INT CUS_ID PK
|
|
VARCHAR CUS_FIRST_NAME
|
|
VARCHAR CUS_LAST_NAME
|
|
VARCHAR CUS_EMAIL
|
|
TIMESTAMP CUS_CREATED_AT
|
|
}
|
|
|
|
ECO_ORDER {
|
|
INT ORD_ID PK
|
|
INT ORD_CUS_ID FK "References ECO_CUSTOMER"
|
|
TIMESTAMP ORD_DATE
|
|
DECIMAL ORD_TOTAL_AMOUNT
|
|
VARCHAR ORD_STATUS
|
|
}
|
|
|
|
ECO_PRODUCT {
|
|
INT PRO_ID PK
|
|
VARCHAR PRO_NAME
|
|
DECIMAL PRO_PRICE
|
|
INT PRO_STOCK_QUANTITY
|
|
}
|
|
|
|
ECO_ORDER_ITEM {
|
|
INT ITE_ORD_ID PK,FK "References ECO_ORDER"
|
|
INT ITE_PRO_ID PK,FK "References ECO_PRODUCT"
|
|
INT ITE_QUANTITY
|
|
DECIMAL ITE_UNIT_PRICE
|
|
}
|
|
|
|
ECO_CUSTOMER ||--o{ ECO_ORDER : "places"
|
|
ECO_ORDER ||--|{ ECO_ORDER_ITEM : "contains"
|
|
ECO_PRODUCT ||--o{ ECO_ORDER_ITEM : "ordered_in"
|
|
```
|
|
|
|
---
|
|
|
|
## 3. Markdown Formatting in `db/mcd.md` and `db/mld.md`
|
|
|
|
- Enclose every diagram inside triple backticks with `mermaid`:
|
|
````markdown
|
|
```mermaid
|
|
flowchart LR
|
|
...
|
|
```
|
|
````
|
|
- Never mix raw HTML script tags; use native Markdown and Mermaid notation.
|