javascript - d3 - 对象恒常性、关键功能和(更新、进入、退出)

标签 javascript d3.js

以下jsfiddle按预期工作。

但是,当我向数据绑定(bind)添加一个键函数时,它会中断。

 // Use source_target as a key to uniquely identify each link.
 var link = svg.selectAll(".link")
     .data(graph.links, function(d){ return d.source + "_" + d.target; });

阅读 ObjectConstancy 教程后,我了解到您可以为每个元素分配一个自定义键,而不是依赖其索引(更新、输入、退出)。

不是这样的吗?我做错了什么?

最佳答案

问题是 d.sourced.target 评估为字符串的内容 -- [object Object]。请记住,强制布局在运行时会将您在数据中指定的索引替换为相应的节点对象。因此,您没有看到预期的所有链接——关键函数为不同的链接返回相同的值,因此它们只被添加一次。

要修复,请使用例如节点名称:

var link = svg.selectAll(".link")
  .data(graph.links, function(d){ return d.source.name + "_" + d.target.name; });

完整演示 here .

关于javascript - d3 - 对象恒常性、关键功能和(更新、进入、退出),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23560274/

相关文章:

javascript - 在 d3.js 中使用 HTML 代替 SVG

javascript - d3 - 将数据附加到轴以进行重新缩放

javascript - 如何在 D3 force layout on load 中为 3 个节点指定 3 种不同的自定义颜色

javascript - jQuery - 简单的图像旋转器

javascript - 选择选项始终选择

javascript - 过渡 d3.radar 图

javascript - 如何将固定范围的垂直线添加到 D3.js 图表

javascript - 旋转 3d javascript Sprite

Javascript创建函数以在其他函数之间共享变量

javascript - 在只有 xPath、anchorOffset 和 focusOffset 的 html 页面中突出显示文本