持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第25天，点击查看活动详情

上一篇我们将组织图形改造成和我们最开始设计的那样，能够显示多个并列的组织树，这一篇介绍另外一款组织结构的图形及其生成方式。

这个项目的链接是：https://github.com/Amor122/MyTest.git

我已经设置了公开权限，大家都可以访问，项目每天的进度基本上是和文章更新一致的，或者略快于文章，我也是边写边发的，有些代码在后续版本说不定就更改了。代码的字数意义不大，有需要的都可以去项目上直接看，这里我都换成了图片。

一、     实现步骤

后台数据上我们先看示例文档的数据格式，只需要把数据组装好就行。

  示例数据

组装的后台接口  

组装好以后，前端改成ajax的方式即可。

将这个comArr数据在ajax中获取，并把其他数据处理和显示的步骤都放入ajax中，原代码中还保留了用户所在组织的特别显示功能，这个功能留给大家拓展使用。

其中的display函数用于处理点击事件

generate函数用于生成数据链表

 

这里需要注意的是有些数据需要在这个ajax操作的，相关函数也要定义在ajax内部，不然有可能就找不到。

我也是拿来就用，推荐给大家也是合适使用即可，教大家的方法也是局部修改，是比较简单的。

最后的效果是这样的

 

不好用的地方就是当界面改变大小时，这个链接线的位置会变化，所以不太合适我们这个可以关闭菜单的框架结构。

 

所以在这里介绍给大家，仅供大家参考，不实装我们的项目。