JS中常用的几种组织架构图的优点

jOrgChart 

https://github.com/wesnolte/jOrgChart 

1. 给定一个嵌套无序列表元素，容易使用。
2. 其中的拖放功能允许重新排序树和底层的<ul>结构。
3. 通过点击相应的节点来显示/隐藏树的特定分支。
4. 节点可以包含除<li>和<ul>之外的任何数量的HTML。
5. 风格简单。
6. 子树折叠，对于大型组织架构有用。

OrgChart 

https://github.com/dabeng/OrgChart 

1. 支持本地数据和远程数据（JSON）。
2. 基于CSS3过渡的平滑展开/折叠效果。
3. 将图表对齐到4个方向。
4. 允许用户通过拖放节点更改组织结构。
5. 允许用户动态编辑组织图并将最终层次结构保存为JSON对象。
6. 支持将图表导出为图片。
7. 支持平移和缩放。
8. 用户可以采用多种解决方案构建庞大的组织图（请参考多层或混合布局部分）。
9. 触摸启用插件的移动divice。

jquery-orgchart 

https://github.com/caprica/jquery-orgchart 

1. HTML标记，包括可点击的超链接;
2. 源列表中的所有属性都会被编入相应的图表节点（例如，您可以使用自己的“数据”属性注释节点）;
3. 可选地向每个图表节点添加“附件”节点（例如，用于“助手到类型”关系）;
4. 用于将图表限制为所需级别数量，并在单个堆栈中显示剩余级别的选项;
5. 从源列表（默认都启用）复制CSS样式，类，HTML数据属性和标题属性（对工具提示或外部工具提示插件有用）的选项;
6. 可选的回调来处理点击的图表节点;
7. 通过覆盖少量的CSS样式规则，容易改变图表的外观;

GetOrgChart 

http://www.getorgchart.com/ 

1. 允许开发人员创建复杂的树结构。
2. 与服务器端组件一起使用时，开发人员还可以使用特制界面和编辑图表。
3. 默认情况下，GetOrgChart包含各种皮肤和调色板，但开发人员也可以创建主题。
4. 如果GetOrgChart图表变得过大，内置的搜索字段允许用户搜索项目。
5. 如果GetOrgChart图表变得过大，用户可以使用表格模式查看原始数据，而不需要视觉层次结构。

D3.js 

https://d3js.org/  

1. D3允许您将任意数据绑定到文档对象模型（DOM）。
2. 提供了非凡的灵活性。
3. D3运算速率极快，支持大量数据和动态行为进行交互的动画。
4. 类似绘制svg的jQuery。