组织架构图展示效果问题

Question

https://hukaibaihu.github.io/... 在线demo

Answer 1

瞎说两句，仅供参考。

用 chrome 开发者工具查看了一下上图的 DOM 结构，“产品研发部”的 div.org-tree-node-label，下面的四个部门是一个 div.org-tree-node-children 容器，叶子是四个 div.org-tree-node is-leaf。

结果是产品研发部的 div.org-tree-node-label 的高度就跟四个叶子的容器 div.org-tree-node-children 的高度相同了，而容器的高度，为四个叶子的高度相加，原因在这里。

思路是：能不能把容器 div.org-tree-node-children 搞成浮动布局，或者 Z-index 调整一下，这样是不是就可以不影响 div.org-tree-node-label 了。因为现在的 DOM 结构，他们显然在一行上。但是，假如这样搞，估计算法会比较复杂一些。