D3：從字典中選擇行時填充表格

Question

我有一個嵌套字典，我爲我的d3折線圖創建。我試圖在鼠標懸停在圖表中的某些行時使用字典數據填充表格。到目前爲止，我已經能夠填充Site列時，我將鼠標懸停線。

HTML：

<table> 
    <tr> 
    <th>Site</th> 
    <th>Model</th> 
    <th>Priority</th> 
    </tr> 
    <tr> 
    <td id = "id1"></td> 
    <td id = "id2"></td> 
    <td id = "id3"></td> 
    </tr> 
</table> 

的JavaScript：

function mouseover(d) { 
    var info = {"A" : {"model":"100", "priority":"Important"}, 
       "B" : {"model":"60", "priority":"Not Important"}, 
       "C" : {"model":"80", "priority":"Important"}, 
       "D" : {"model":"80", "priority":"Not Important"}, 
       "E" : {"model":"60", "priority":"Important"} 
      } 
    d3.select("#id1").text(d.data.site); // works 

} 

預期輸出在表會是什麼樣子的，當鼠標懸停在"B"線以下：

Site Model  Priority 
B  60  Not Important 

Answer 1

我只是想通了。我很抱歉，我的帖子...

如果你想知道如何做到這一點：

function mouseover(d) { 
    var info = {"A" : {"model":"100", "priority":"Important"}, 
       "B" : {"model":"60", "priority":"Not Important"}, 
       "C" : {"model":"80", "priority":"Important"}, 
       "D" : {"model":"80", "priority":"Not Important"}, 
       "E" : {"model":"60", "priority":"Important"} 
      } 
    d3.select("#id1").text(d.data.site); 
    d3.select("#id2").text(info[d.data.site]["model"]); 
    d3.select("#id3").text(info[d.data.site]["priority"]); 
}