json - 无法将 JSON 绑定(bind)到 d3

Question

我进行了广泛的搜索，但始终无法将 JSON 数据绑定(bind)到简单的散点图。我查看了帖子和示例，但我只能绑定(bind)数组而不是 JSON。下面，我尝试简单地将 JSON 数据显示为文本，但仍然无法使其工作。如果您知道原因，请告诉我!

d3_attempt.js

var data;

d3.json("json_data.json",function(error, dataset) {
    if (error) return console.warn(error);

    data = dataset;

    var myscatter = d3.select("#somediv").append("svg")
                    .attr("width", 700)
                    .attr("height", 400);

    myscatter.selectAll("text")
        .data(data.data)
        .enter()
        .append("text")
        .text(function(d){return d)})
});

json_data.json

{
    "data":
    {
        "john": {"name": "john", "age": "13"},
        "matt": {"name": "matt", "age":"14"}
    }
}

Answer 1

是的，您只能绑定(bind)数组，因此您可能希望将数据转换为数组:

myscatter.selectAll("text")
    .data(d3.values(data.data));

这将为每个 text 节点提供 { name,age } 对象作为数据。如果您也需要键(在本例中看起来不需要)，您可以使用 d3.entries，它为您提供一个对象数组，例如 { key: "john", value :{姓名:“约翰”，年龄:“13”}}。