d3.js - 我可以使用 D3.js 创建流程图(无树形图)

Question

已结束。此问题正在寻求书籍、工具、软件库等的推荐。它不满足 Stack Overflow guidelines 。目前不接受答案。

---

我们不允许提出寻求书籍、工具、软件库等推荐的问题。您可以编辑问题，以便用事实和引文来回答。

已关闭 4 年前。

Improve this question

我可以创建一个像这样的流程图吗:

使用 D3.js 开始形成 json 对象图书馆？

json 结构应该是什么样的？

你有我可以分析的例子吗？

非常感谢。

Answer 1

我可以创建这样的流程图吗？

D3 有能力做到这一点。

使用 D3.js 库从 json 对象开始？

是的

json 结构应该是什么样子？

取决于您如何处理该项目。我正在使用强制布局并删除强制，所以我的 JSON 是

{node:
    [{
        id: 1,
        title: 'title'
    }],
 link: 
    [{
        source: 0,
        target: 1
    }]
 }

你有我可以分析的例子吗？

为您提供灵感

• http://marvl.infotech.monash.edu/webcola/
• http://www.coppelia.io/2014/07/an-a-to-z-of-extra-features-for-the-d3-force-layout/

起点https://github.com/mbostock/d3/wiki/Force-Layout

如何将文本换行 http://bl.ocks.org/mbostock/7555321

D3.js 不太适合这种可视化。可视化太复杂，无法进行从数据到 SVG 的简单映射

不知道为什么，但 IMO 流程图是最简单的图表、 block 和连接它们的线类型之一。 D3 具有绘制节点和连接器的内置方法。是的，这不是开箱即用的解决方案。但您所需要做的就是学习和定制。