D3.js中的数据绑定

data binding in d3.js

本文关键字：数据绑定 js D3      更新时间：2023-09-26

注意：我对javascript和d3完全陌生.js(从昨天开始(，如果我忽略了一些明显的东西，请道歉。

我在理解 d3 如何处理数据以及数据绑定如何工作方面遇到问题。我正在尝试重新创建此热图不同之处在于我的起始表应该包括标签而不是索引。(数据来自数据库请求(。

 day hour   value
 Mon am 16
 Mo pm 20
 Tue am 0
 Tue pm 0
 Wed  am 45
 Wed pm 8

我知道 d3.js 有一个变量，变量 d(用于数据(和 i 用于索引，但我无法弄清楚如何使用它。

到目前为止，我已经尝试更换线条 

          .attr("x", function(d) { return (d.hour - 1) * gridSize; })
          .attr("y", function(d) { return (d.day - 1) * gridSize; })

跟 

          .attr("x", function(d,i) {return d.hour, i * gridSize;})  
          .attr("y", function(d,i) {return d.day, i * gridSizee;})

但是我得到一个奇怪的盒子排列。

我错过了什么？

我真正的问题是：如何访问索引而不是值？

提前致谢

您使用的函数提供索引作为第二个变量，将数据作为第一个变量，因此您需要调用数据变量，但随后可以忽略它：

 .attr("x", function(d,i) {return i * gridSize;})
相关文章：