对d3.js中的选择进行排序会干扰数据连接

Question

当我使用selection.sort()对d3中的路径选择进行重新排序时，数据连接会受到干扰，我的路径会被重新分配给错误的数据对象。

我只想对路径进行重新排序，以便一些路径最终位于其他路径之上(如z-index)。我不想将数据对象从一条路径重新分配到另一条路径。

如何在不干扰数据连接的情况下对路径进行重新排序？

_friends.selectAll('path').sort(function(a, b){
  return d3.ascending(a.Q, b.Q);
});

Answer 1

听起来您需要指定一个 function。这允许您通过任意键绑定数据，而不是依赖于默认设置，即使用数据在数组中的位置，即顺序(在您的情况下，顺序可能会改变)。

如果您还没有为每个数据提供唯一的键，则始终可以在加载时生成它们：

var id = 0;
for (var i = 0; i < data.length; i++) data[i].id = id++;

如果您创建了任何新数据，您可以继续递增id以获得一个新的、惟一的ID。

然后，对于数据绑定，您可以这样做：

.data(data, function(d) { return d.id; })