不同的数据绑定方式有何不同?

时间:2015-10-26 09:17:56

标签: d3.js

从本教程:http://bl.ocks.org/mbostock/3808234,我读了

  var text = svg.selectAll("text")
      .data(data, function(d) { return d; });

有时我会阅读其他教程,如下所示,它适用于他们的用例:

  var text = svg.selectAll("text")
      .data(data);

本教程无法通过第二种方式无法触发输入&出口。那么概念上这两种方式有什么不同呢?

1 个答案:

答案 0 :(得分:1)

来自selection.data的精细手册:

  

selection.data([values[, key]])

     

如果未指定键功能,则值中的第一个数据为   分配给当前选择中的第一个元素,第二个元素   数据到第二个选定的元素,依此类推。

     

[...]

     

可以指定键功能键([d [,i]])来控制数据的方式   加入元素(这取代了默认的索引行为)。   key函数返回一个字符串,用于连接数据   它的相应元素,基于先前绑定的数据。

在您的示例中,function(d) { return d; }指定密钥是使用的字母。稍后的调用将能够确定哪个节点代表什么字母,从而确定进入和退出选择。

如果没有此密钥,除了传递数据的顺序之外,您没有任何数据可以匹配调用之间的节点。