一篇本应该很早以前就写的文章，拖到现在终于填坑了(请脑补做出这个违背祖宗的决定有多挣扎，不是)。又臭又长，但希望能对还没入门 D3.js 数据可视化的人有帮助

本文探讨十万级节点流畅渲染的优化手段，如何使用 D3 配合 Three.js 进行海量社交关系数据的流畅绘制，代码均已开源，附有详细图片和 Demo。

上面的demo就是使用 D3.js + Canvas 的方式实现的, 在组织的层数超过300时才会出现明显的卡顿, 能满足大部分的组织结构图的数据. 上面的变量 nodes 和 links 现在就包含了结构图中每个 组织节点 和 连接线 的坐标信息. 2. 使用Canvas绘图…

效果：​包含代码点：1、动态请求数据并更新参考链接：https://www.cnblogs.com/shihuc/p/6064448.html2、circle节点图片展示3、text文字自动换行参考链

原 demo 基于 D3.js v3 开发, 笔者将其使用 D3.js v5 进行重写, 并改为使用 ES6 语法. 可以看到, 上图左上角为图例, 中间为各个手机公司之间的专利关系图. 下面让我们看看如何一步步实现上图的效果. 需要注意的是: 有一些公司 (如 Apple, …