Javascript 使用data（）方法向d3.js图表中的嵌套元素添加键

我正在构建一个d3.js图表，该图表在数据中有一些嵌套级别，在应用

data（）

函数时，我在为行指定键时遇到了问题。下面简单介绍一下相关的部分

我的数据如下表所示：

[
    {
        name: 'United States',
        values: [ {year:1960, imports:12, exports:13}, etc... ]
    },
    {
        name: 'China',
        values: [ {year:1960, imports:10, exports:11}, etc... ]
    }
]

我创建的基本图形如下所示：

var svg = d3.select(this).selectAll('svg').data([data]);
var g = svg.enter().append('svg').append('g').attr('class', 'main');
g = svg.select('g.main')

一切似乎都很好。对于数据中的每个国家，我画了两条线，因此我将它们组合在一起（）

这似乎也很好——控制台在

data（）

调用的关键部分显示“中国”和“美国”

但我正在努力为每个

行组中的行添加一个键。例如，这样做：

lines_g.selectAll('path.line.imports')
         .data(function(d) { return [d.values]; },
               function(d) { console.log(d); return d.name; })
         .enter().append('path')
           .attr('class', 'line imports');

控制台显示我希望通过记录
d.values
而不仅仅是
d
得到的数组：

[ {year:1960, imports:12, exports:13}, etc... ]

为什么此时我不能访问
d
，因此不能访问
d.name
？而且，给组内的行指定与其组相同的键是否正确
 这里处理的是嵌套选择。也就是说，每个国家都有一个顶级选择，每个国家都有一个仅包含价值观的子选择——这就是你所说的

.data(function(d) { return [d.values]; })

在此之后，您只能直接访问
d.values
中的内容。您从中记录
d
的关键函数将获得您之前指定的数组元素--
[d.values]

如果需要访问父数据元素的名称，我建议将此信息也放入子元素中。也就是说，每个
{year:1960，…}
也有一个
名称：“中国”
成员。您可以通过以下代码实现这一点：

data.forEach(function(d) {
  d.values.forEach(function(e) {
    e.name = d.name;
  });
});

但这会重复很多信息，在您的情况下可能不需要。由于每个国家/地区只有一个数据元素，您可以直接传入
[d]
，而不是
[d.values]
。这只需要在调用line generator的方式上做一点小的更改，还可以让您在关键函数中访问国家的名称

我已经从另一个问题修改了JSFIDLE来实现这一点。
Ahh，谢谢Lars。我没有意识到，一旦分配了数据，那么键值就只能访问它——我认为它们都可以访问相同的东西，因为它们都同时被传递到
data（）
函数中。这似乎是可行的，虽然对于我正在使用的一些区域和clippath来说可能会有点复杂，但我会尝试解决这个问题。再次感谢。
data.forEach(function(d) {
  d.values.forEach(function(e) {
    e.name = d.name;
  });
});