docs: update tidy-tree Readme

on-behalf-of: @Mermaid-Chart <hello@mermaidchart.com>
This commit is contained in:
darshanr0107
2025-08-11 14:22:08 +05:30
parent 1507435e15
commit dd36046e23
2 changed files with 14 additions and 20 deletions

View File

@@ -8,44 +8,42 @@ This package provides a bidirectional tidy tree layout engine for Mermaid based
## Usage ## Usage
flowchart-tidy-tree TD ```
A --> B
A --> C
--- ---
config: config:
layout: tidy-tree layout: tidy-tree
--- ---
mindmap
flowchart TD root((mindmap))
A --> B A
A --> C B
```
### With bundlers ### With bundlers
sh ```sh
npm install @mermaid-js/layout-tidy-tree npm install @mermaid-js/layout-tidy-tree
```
ts ```ts
import mermaid from 'mermaid'; import mermaid from 'mermaid';
import tidyTreeLayouts from '@mermaid-js/layout-tidy-tree'; import tidyTreeLayouts from '@mermaid-js/layout-tidy-tree';
mermaid.registerLayoutLoaders(tidyTreeLayouts); mermaid.registerLayoutLoaders(tidyTreeLayouts);
```
### With CDN ### With CDN
html ```html
<script type="module"> <script type="module">
import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.esm.min.mjs'; import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.esm.min.mjs';
import tidyTreeLayouts from 'https://cdn.jsdelivr.net/npm/@mermaid-js/layout-tidy-tree@0/dist/mermaid-layout-tidy-tree.esm.min.mjs'; import tidyTreeLayouts from 'https://cdn.jsdelivr.net/npm/@mermaid-js/layout-tidy-tree@0/dist/mermaid-layout-tidy-tree.esm.min.mjs';
mermaid.registerLayoutLoaders(tidyTreeLayouts); mermaid.registerLayoutLoaders(tidyTreeLayouts);
</script> </script>
```
## Supported layouts ## Tidy Tree Layout Overview
tidy-tree: The bidirectional tidy tree layout tidy-tree: The bidirectional tidy tree layout

View File

@@ -65,10 +65,6 @@ export async function createGraphWithElements(
node.width = boundingBox.width; node.width = boundingBox.width;
node.height = boundingBox.height; node.height = boundingBox.height;
graph.setNode(node.id, { ...node }); graph.setNode(node.id, { ...node });
if (node.parentId) {
// Optionally store the parent relationship (Graphology doesn't have a native parent-child concept)
// e.g., you could update the node attributes or handle it as needed.
}
} }
}) })
); );