marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-08-15 06:19:24 +02:00
Code Issues Packages Projects Releases Wiki Activity

docs: improve elk section of ER docs

Browse Source
This commit is contained in:
Alois Klink
2025-04-07 16:07:43 +08:00
parent 0104d19f66
commit de72e18a7f
2 changed files with 36 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
docs/syntax/entityRelationshipDiagram.md
View File

@@ -625,17 +625,43 @@ erDiagram
## Configuration
### Renderer
### Layout
The layout of the diagram is done with the renderer. The default renderer is dagre.
The layout of the diagram is handled by [`render()`](../config/setup/mermaid/interfaces/Mermaid.md#render). The default layout is dagre.
You can opt to use an alternate renderer named elk by editing the configuration. The elk renderer is better for larger and/or more complex diagrams.
For larger or more-complex diagrams, you can alternatively apply the ELK (Eclipse Layout Kernel) layout using your YAML frontmatter's `config`. For more information, see [Customizing ELK Layout](../intro/syntax-reference.md#customizing-elk-layout).
```yaml
---
config:
layout: elk
---
```
Your Mermaid code should be similar to the following:
```mermaid-example
---
config:
layout: elk
title: Order example
config:
layout: elk
---
erDiagram
CUSTOMER ||--o{ ORDER : places
ORDER ||--|{ LINE-ITEM : contains
CUSTOMER }|..|{ DELIVERY-ADDRESS : uses
```
```mermaid
---
title: Order example
config:
layout: elk
---
erDiagram
CUSTOMER ||--o{ ORDER : places
ORDER ||--|{ LINE-ITEM : contains
CUSTOMER }|..|{ DELIVERY-ADDRESS : uses
```
> **Note**

12
packages/mermaid/src/docs/syntax/entityRelationshipDiagram.md
View File

@@ -407,23 +407,22 @@ erDiagram
## Configuration
### Renderer
### Layout
The layout of the diagram is handled by [`render()`](../config/setup/mermaid/interfaces/Mermaid.md#render). The default layout is dagre.
For larger or more-complex diagrams, you can alternatively apply the ELK (Eclipse Layout Kernel) layout using your YAML frontmatter's `config`. For more information, see [Customizing ELK Layout](../intro/syntax-reference.md).
For larger or more-complex diagrams, you can alternatively apply the ELK (Eclipse Layout Kernel) layout using your YAML frontmatter's `config`. For more information, see [Customizing ELK Layout](../intro/syntax-reference.md#customizing-elk-layout).
```
```yaml
---
config:
layout: elk
layout: elk
---
```
Your Mermaid code should be similar to the following:
``````mermaid-example
```mermaid
```mermaid-example
---
title: Order example
config:
@@ -434,7 +433,6 @@ erDiagram
ORDER ||--|{ LINE-ITEM : contains
CUSTOMER }|..|{ DELIVERY-ADDRESS : uses
```
``````
```note
Note that the site needs to use mermaid version 9.4+ for this to work and have this featured enabled in the lazy-loading configuration.