我正在尝试将我的分层边缘捆绑图表移动到 d3v4。
但找不到 d3.layout.bundle() 的替代方案。
d3v3 的例子是https://bl.ocks.org/mbostock/7607999
有 d3v4 的例子吗?请帮忙。
您需要两件事:层次结构和层次结构中节点之间的链接数组。
您可以使用 JSON 加载层次结构或从 CSV 创建层次结构d3.stratify
。然后将层次结构传递给d3.hierarchy
. See d3 层次结构文档.
然后您需要构建一个链接数组。每个链接都是一个带有source
and target
,每个都指向层次结构中的一个节点。
您可以使用以下组合来计算和绘制束node.path
(这取代了d3.layout.bundle
) and d3.curveBundle
. See d3.curveBundle 文档.
If links
是您的链接数组,代码如下所示:
const line = d3.line()
.x(d => d.data.x)
.y(d => d.data.y)
.curve(d3.curveBundle.beta(0.95));
const edges = g.selectAll('.link').data(links);
edges.enter().append('path')
.attr('class', 'link')
.merge(edges)
.attr('d', d => line(d.source.path(d.target)));
edges.exit().remove();
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)