gj-mindtree v1.0.7

gj-mindmap

简述

这是一个基于svg.js与svgdotjs.github.io实现的简单思维导图

安装

npm i gj-mindmap

yarn add gj-mindmap

导入项目

1. 在项目中引入包的入口文件

import {createSVG} from 'gj-mindmap'

2. 准备好一个dom节点，并设置好id

<div id="container"></div>

3. 准备好数据，格式如下：

 const metaData = {
    root:{
        text:'root',
        isRoot:true,
        isExpend:true,
        layerIndex: 0,
        children:[
            {
                text:'child1',
                isRoot:false,
                isExpend:true,
                layerIndex: 1,
                
                children:[
                    {
                        text:'child1-1',
                        isRoot:false,
                        isExpend:true,
                        layerIndex: 2,
                        children:[]
                    }
                ]
            },
            
        ]
    }
}

4. 调用createSVG创建画布并初始化思维导图
   • el:DOM元素的id
   • data：上述格式的数据
   • sizeWidth：画布的宽度
   • sizeHeight：画布的高度

const rendertree = createSVG(el, data, sizeWidth, sizeHeight)