data.key 未定义：如何解析 json 数据

Question

我想绘制与城市大小成比例的矩形。但是我一直被解析数据所困。我可以取出数据的键，但是当我通过执行 data.key 使用键时，它给了我“未定义”。我认为问题在于键是字符串，因为 data.Amsterdam 工作正常。我该如何解决这个问题？

var current = "Amsterdam"

var g = d3.select("body")
    .append("svg:svg")
    .attr("width", 1000)
    .attr("height", 1000)
    .append("svg:g");

d3.json("data_2014.json", function (error, data) {
    for (var key in data) {
        console.log(data.key)
        g.append("rect")
            .attr("width", data.key.a_opp_ha/100)
            .attr("height", data.key.a_opp_ha/100)
            .attr("x", 0)
            .attr("y", 0)
            .attr("fill", function (ding) {
                if (key === current) {
                    return "blue";
                } else {
                    return "none"};
                }
            })
            .attr("stroke", "teal");
    }
})

示例数据：

{
  "'s-Gravenhage": { "a_opp_ha": "9811", "a_pau": "178360", "ste_oad": "4755" },
  "Amsterdam": { "a_opp_ha": "21949", "a_pau": "230675", "ste_oad": "6096" }
}

Answer 1

您应该使用data[key] 表达式而不是data.key。