javascript - 使用变量调用数据集d3.js中的数据列

Question

嘿，伙计们，抱歉，如果这是一个愚蠢的问题，我真的是 Javascript/d3.js 菜鸟。所以基本上我有一个 .csv 文件，其中包含许多国家及其每年的军事力量，如下所示:

year,country1,country2,country3,...

1989,192129,129312,12391,...

1990,192913,123131,12331,...

1991,123112,123123,12313,...

我制作了一个折线图，其中 x 轴为年份，y 轴为国家力量

d3.csv("data.csv", function(error, data) {
if (error) throw error;
data.forEach(function(d) {
  d.Year = parseTime(d.Year);
  d.NLD = +d.NLD;
});

x.domain(d3.extent(data, function(d) { return d.Year; }));
y.domain([0, d3.max(data, function(d) { return d.NLD; })]);

(NLD 是国家/地区代码)以及取自 https://bl.ocks.org/d3noob/257c360b3650b9f0a52dd8257d7a2d73 的其他内容

这工作正常，但现在我的问题是我可以创建一个可以代替 NLD 的变量，以便您可以轻松地在它们之间进行更改，例如

var country = "NLD";

然后放置该变量，使代码如下所示

d3.csv("data.csv", function(error, data) {
if (error) throw error;
data.forEach(function(d) {
  d.Year = parseTime(d.Year);
  d.country = +d.country;
});

x.domain(d3.extent(data, function(d) { return d.Year; }));
y.domain([0, d3.max(data, function(d) { return d.country; })]);

将其放在像 d.{country} 这样的大括号之间对我来说也不起作用。

很抱歉，如果以前有人问过这个问题，但我不知道如何问这个问题，并且我进行了搜索，但没有找到任何内容。

Answer 1

您可以阅读更多相关信息here但基本上属性访问器采用两种形式之一，如 d.country 中的点访问器或如 d['NLD'] 中的方括号访问器。使用点表示法，点后面的任何内容都必须是有效的属性名称。在您的代码中，d.country 实际上是在查找对象 d 上的 country 属性的值。在这种情况下，您应该做的是使用方括号访问器。在方括号访问器中，无论您在方括号中放入什么，它的计算结果都会成为要访问的属性。所以你的代码看起来像这样

var country = 'NLD'
...
y.domain([0, d3.max(data, function(d) { return d[country]; })]);

这相当于编写d['NLD']，这相当于编写d.NLD