javascript - 将json代码集成到d3 html文件中

Question

我正在通过以下链接测试桑迪图:https://gist.github.com/d3noob/c2637e28b79fb3bfea13

但我只能在 Firefox 中看到图表，而不能在 Chrome 中看到。我怀疑是因为 Chrome 不允许从外部文件访问数据。

因此，我尝试集成json代码，但是当我尝试时，图表在Firefox中没有显示

我添加了一个包含所有 json 代码的变量，例如:

var dataset = {"nodes":[{"node":0,"name":"node0"},{"node":1,"name":"node1"},{"node":2,"name":"node2"},{"node":3,"name":"node3"},{"node":4,"name":"node4"}],"links":[{"source":0,"target":2,"value":2},{"source":1,"target":2,"value":2},{"source":1,"target":3,"value":2},{"source":0,"target":4,"value":2},{"source":2,"target":3,"value":2},{"source":2,"target":4,"value":2},{"source":3,"target":4,"value":4}]};

我已经替换了这行代码:

d3.json("sankey-formatted.json", function(error, graph) {

对于这个(只需用数据集变量替换文件名):

d3.json(dataset, function(error, graph) {

，，，但不是图表没有显示。知道为什么桑基图没有显示吗？

谢谢

Answer 1

您面临的问题是 d3.json ...

...returns a new request to get the JSON file at the specified url with the default mime type application/json.

话虽这么说，解决方案比您想象的要简单:因为您已经有一个包含所有数据的变量，只需将其命名为 graph (您的 d3.json函数加载文件并填充名为 graph 的数据数组):

var graph = {"nodes":[{"node":0,"name":"node0"},...

并删除d3.json函数，不要忘记删除右花括号/括号:

d3.json("sankey-formatted.json", function(error, graph) {//remove this...

    //your function

});//...and don't fortget to remove this too.