D3 加载 CSV 文件，然后仅使用特定列

我很难从 CSV 文件中获取两列，我计划用它构建一个基本的条形图。我计划在一个数组中获取 2 个数组（每列一个），我将使用它们来构建条形图。如您所知，刚刚开始使用 D3。

当前加载数据会获取一个对象数组，然后获取两列键值对会变得一团糟。我不确定我的想法是否正确......

我看到这个类似的问题：

d3 - 从 csv 文件加载两个特定列 https://stackoverflow.com/questions/32381347/d3-load-two-specific-columns-from-csv-file

但是我将如何使用选择和 Enter() 来实现我的目标呢？

您无法仅加载较大 CSV 的 2 列，但您可以加载整个内容并提取所需的列。

假设你的 csv 是这样的：

col1,col2,col3,col4
aaa1,aaa2,aaa3,aaa4
bbb1,bbb2,bbb3,bbb4
ccc1,ccc2,ccc3,ccc4

然后你加载它

csv('my.csv', function(err, data) {
  console.log(data)
  /*
    output:
    [
      { col1:'aaa1', col2:'aaa2', col3:'aaa3', col4:'aaa4' },
      { col1:'bbb1', col2:'bbb2', col3:'bbb3', col4:'bbb4' },
      { col1:'ccc1', col2:'ccc2', col3:'ccc3', col4:'ccc4' }
    ]
  */
})

如果你只想col2 and col3（并且您不想简单地将其他列的数据留在那里，无论如何这不应该成为问题），您可以这样做：

var cols2and3 = data.map(function(d) {
  return {
    col2: d.col2,
    col3: d.col3
  }
});

console.log(cols2and3)
/*
  output:
  [
    { col2:'aaa2', col3:'aaa3' },
    { col2:'bbb2', col3:'bbb3' },
    { col2:'ccc2', col3:'ccc3' }
  ]
*/

IE。上面的代码生成了一个新的对象数组，每个对象只有两个 props。

如果您只需要每列一个值数组（而不是具有两列值的对象），您可以：

var col2data = data.map(function(d) { return d.col2 }
var col3data = data.map(function(d) { return d.col3 }

console.log(col2) // outputs: ['aaa2', 'bbb2', 'ccc2']