Mindmap-Tree

A Web-Based Javascript Mindmap

简体中文文档


Demo

Demo

Feature

* Add & Delete Node
* Edit Node Text
* Undo & Redo
* Change Scale
* Drag Node to change Father
* Keyboard operation
* Multi select
* Expand & Shrink Node

Get Started

$3

``sh
npm install -S mindmap-tree
`

$3

`html





`

`js
import MindmapTree from 'mindmap-tree';
import 'mindmap-tree/style.css';

new MindmapTree({
container: '#container',
});
``

$3

MindmapTree constructor options:

| Prop | Type | Default | Description |
| ------------- | :---------------: | ------------------------ | ------------------------- |
| container | String \| Element | '' | HTML element of container |
| data | NodeDataMap | Record | Initial data of mindmap |
| isDebug | Boolean | false | Is debug or not |

NodeData params:

| Prop | Type | Default | Description |
| ------------- | :------: | ------- | ---------------------------------------- |
| label | String | '' | Node label |
| direction | Number | 0 | Node direction, 1:right, 0:none, -1:left |
| isRoot | Boolean | false | Is root node or not |
| children | String[] | [] | children ids |
| isExpand | Boolean | true | To expand node or not |

License

MIT

Copyright (c) 2023 - present, RockyRen