Question

我正在尝试将数据放入模板中，代码在这里从第32行-第46行可以看到数据。

concat(strBuild).subscribe(
    s => s.subscribe(e => str += e + " "), //s is an Observable so we need to subscribe
    err => {},
    () => str.trim()
)

但是，他们是在脚本中手动输入数据的，每次输入都花很长时间。反正我可以使用

Observables

在这里，以便从本地文件加载csv文件？我见过人们在教程中使用它，但无法弄清楚如何将其链接到脚本的其余部分。

非常感谢

更新：使用v5后，格式未定义：

        var myData = "date,Heritage,Museum,Art

Answer 1

如果您使用的是D3.js v5，则可以通过以下操作导入本地CSV文件：

d3.csv("/path/to/file.csv").then(data => {
  console.log(data); // [{"Hello": "world"}, …]
});

您将可以访问then()块中从CSV文件提取的数据。从上面的示例可以看到，console.log()时，您应该可以从CSV中看到完整的数据。您可以通过here阅读更多有关它的内容。

d3.csv("/path/to/file.csv").then(data => {
  console.log(data);
  var margin = {
      top: 20,
      right: 100,
      bottom: 30,
      left: 50
    },
    width = 900 - margin.left - margin.right,
    height = 500 - margin.top - margin.bottom;
  var parseDate = d3.time.format("%Y").parse;
  var x = d3.time.scale()
    .range([0, width]);
  var y = d3.scale.linear()
    .range([height, 0]);
    
  // add the rest of the code here
});

关于您更新的问题，由于您已从V3升级到V5，因此语法有很多更改。

var parseDate = d3.time.format("%Y").parse

应更改为

var parseDate = d3.timeParse("%Y");

有关完整的迁移指南，您可以参考changelog。

d3.js中的时间格式（％“ Y”）

1 个答案: