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"]);
}

D3：选择行时从Dict填充表

1 个答案: