数据可视化 gojs 实践关系图 demo:节点分组
本文是关于如何使用可视化库 gojs 完成节点分组关系展示的,从零基础到实现最终效果。希望对使用 gojs 的小伙伴有帮助。 1. 节点分组需求及 demo 展示 需求 能正确展示组的层次,以及节点之间的关系。 单选节点、多选节点,获取到节点信息 选中组,能选中组中的节点,能获取到组中的节点信息 选中节点,当前节点视为根节点,能选中根节点连线下的所有节点,并获取到节点信息 2. 准备 从后端获取到的接口数据: const data = { "properties": [ { "key": "t-2272", "parentKey": "j-1051", "name": "哈哈" }, { "key": "p-344", "parentKey": "g--1586357764", "name": "test" }, { "key": "t-2271", "parentKey": "j-1051", "name": "查询" }, { "key": "t-2275", "parentKey": "j-1052", "name": "开开心心" }, { "key": "j-1054", "parentKey": "p-344", "name": "嘻嘻" }, { "key": "t-2274", "parentKey": "j-1052", "name": "查询" }, {