将 csv 加载到 nvd3 以制作离散条形图答案

【问题标题】：loading csv into nvd3 to make discrete bar chart将 csv 加载到 nvd3 以制作离散条形图
【发布时间】：2013-10-30 20:37:50
【问题描述】：

我有以下 CSV 文件：

Fun,Stupid,Yes,No
50,-20,100,70

我想将其加载到 nvd3 中以制作离散条形图。我知道这很容易，但我要花很长时间来处理数据。

我尝试了以下方法：

d3.csv("/path/to/file", function(data){
                console.log(data);
                 });

我得到以下对象，它不适用于 nvd3：

[{Fun:50, Stupid: -20, Yes: 100, No: 70}]

谢谢。

【问题讨论】：

【解决方案1】：

nvd3 需要一个相当具体的数据表单，因此您需要将数据放入该表单。它期望的形式是：

[
    {
        key: "totals",
        values: []
    }
 ];

空数组由 d3.csv 中的对象填充，注意 nv 期望您的对象数组的名称被称为 values。

所以第一步是创建一个像这样的空对象：

var exampleData = [
    {
        key: "totals",
        values: []
    }
];

然后用你的数据填充它：

data.forEach(function (d){
    d.value = +d.value
    exampleData[0].values.push(d)
})

这一切都需要在您的 d3.csv 调用中。

要使用这种格式，您需要将您的 csv 文件组织成列，其中您的姓名在一列中，您的值在另一列中，例如：

标签，值

有趣，50

愚蠢，-20

【讨论】：