可拖动的angular分层树形图

可拖动的angular分层树形图
插件名称 angular2-tree-diagram
发布时间 2020年5月30日
插件作者 artbelikov

用于Angular 2+的可拖动,可缩放,可缩放的分层树图组件。

家庭和组织树的理想选择。

更多功能:

  • 可配置的节点宽度/高度
  • 添加/删除节点
  • 树状UI
  • 纯CSS关系线
  • 没有依赖

安装:

#NPM
$ npm install angular2-tree-diagram --save

用法:

在您的项目中导入模块
使用树形图指令
传递节点数组和配置
有关更多详细信息,请参见example.json

<tree-diagram [data]="data"></tree-diagram>
...
data = {
  json: [
    {
      "guid": "bc4c7a02-5379-4046-92be-12c67af4295a",
      "displayName": "Elentrix",
      "children": [
        "85d412c2-ebc1-4d56-96c9-7da433ac9bb2",
        "28aac445-83b1-464d-9695-a4157dab6eac"
      ]
    },
    ...
  ],
  config: {
    nodeWidth: 200,
    nodeHeight: 100
  }
}