Question

我正在尝试使用JSON文件中的数据创建带有d3的堆积条形图。每个酒吧都有特定月份的关系，损失和胜利。

JSON文件：

{
    "name": "FHS",
    "points": 3000,
    "ties": 3,
    "losses": 19,
    "wins": 50,
    "games": {
        "2010-09": { "ties": 1, "losses": 2, "wins": 16 },
        "2010-10": { "ties": 2, "losses": 5, "wins": 13 },
        "2010-11": { "ties": 0, "losses": 12, "wins": 21 }
    }
}

我已经使用d3.json功能很好地使用了一些数据。例如：

d3.json("data.json",function(error,data)
    {
        alert(data.name);
        alert(data.points);
        // etc.
    });

但是这里有趣（fyi，我正在使用下划线库来获取“游戏”的每个属性......也许这就是我出错的地方？）。如果我尝试以下内容：

_.keys(data.games).forEach(function(d)
    {
        alert(d);
    });

我在三个不同的警报框中得到了2010-09,2010-10,2010-11 ......完美！但是，如果我尝试以下内容：

_.keys(data.games).forEach(function(d)
    {
        alert(d.ties);
    });

我未定义：/事实上，我看到的另一个问题是

alert(data.games.2010-09.ties);

应该工作（如果属性名称不是以整数开头或有连字符......），但不会因为文字的格式（“2010-09”）...所以，我的主要问题是如何以一种简化生成图表的方式动态访问嵌套对象属性。我试图包含足够的上下文，但如果您想了解更多信息，请告诉我。提前谢谢！

Answer 1

您在警告框中未定义，因为此函数内的d是一个字符串 - “2010-09”，“2010-10”，“2010-11”等 - 因为您正在迭代在_.keys(data.games)返回的字符串数组上。

因此，alert(d.ties)就像调用alert("2010-09".ties)一样，预计未定义。

但是，建立在Lars解释的基础上，

_.keys(data.games).forEach(function(d)
{
    alert(data.games[d].ties);
});

是您获取数据的方式。

P.S。 console.log(data.games[d].ties)是调试javascript的更强大的方式（因此通常是首选方式）。

Answer 2

您可以将密钥括在[""]中以访问该值，即alert(data.games["2010-09"].ties);将起作用。您可能还对使用键值结构的d3函数感兴趣;见the documentation。

如何使用从同一文件获取的文字访问JSON文件中的对象属性

2 个答案: