确保d3数据元素匹配id？

Question

我有一堆带有多边形的现有svg。每个多边形都有一个唯一的id，每个id都有一些相关的数据。

我的问题是：如果我做自然d3加入：

d3.selectAll("polygon").data(array_of_data)

无论如何确保与多边形关联的数据元素是正确的吗？

或者我只需要保持array_of_data的顺序与所选多边形的顺序相同吗？

Answer 1

D3的data()函数采用可选的第二个参数，旨在提供数据和DOM节点之间的这种对应关系。试试这个：

d3.selectAll('polygon').data(array_of_data, function(d) { return d.id; });

data()的第二个参数是一个回调函数，当用数据调用时，返回将每个DOM节点绑定到它的相应数据的键。当你不提供这样的功能时，D3没有选择，只能使用索引将数据绑定到DOM节点。