Skip to content

Latest commit

 

History

History
58 lines (46 loc) · 1.12 KB

README.md

File metadata and controls

58 lines (46 loc) · 1.12 KB

org-tree-helper

用于生成组织架构图布局的工具函数

Install

npm i org-tree-helper
# or
yarn add org-tree-helper

Usage

import orgTreeHelper from 'org-tree-helper';

// 树形数据必须保证有children, size属性(表示节点宽高的数组)
// 支持跨层数据,使用isEmpty: false表示
const treeData = {
  name: '1',
  size: [50, 50],
  children: [
    {
      name: '2',
      size: [100, 50],
      children: []
    },
    {
      name: '3',
      size: [20, 50],
      children: []
    }
  ]
};

// 节点之间左右和上下的间距,默认为[20, 20]
const spacing = [20, 40];
// 是否水平,默认为false
const horizontal = true;

// 返回线条信息、节点信息、布局边界信息
const { pathData, nodesData, layoutExtents } = orgTreeHelper(treeData, {
  spacing,
  horizontal
});

// 使用canvas/svg渲染
// render your chart here

Examples

https://github.com/reactjser/org-tree-demo

screenshot