d3.js中的數據綁定

Question

注意：對於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;})  

但是我把盒子弄得奇怪了。

我錯過了什么？

我真正的問題是：如何訪問索引而不是值？

提前致謝

Answer 1

您正在使用的函數將索引作為第二個變量，將數據作為第一個變量，因此您需要調用data變量，但是可以忽略它：

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