使用 d3.json 导入本地 json 文件不起作用
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/17214293/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Importing local json file using d3.json does not work
提问by Aleks G
I try to import a local .json-file using d3.json().
我尝试使用 .json 文件导入本地 .json 文件d3.json()。
The file filename.jsonis stored in the same folder as my html file.
该文件filename.json与我的 html 文件存储在同一文件夹中。
Yet the (json)-parameter is null.
然而 (json) 参数为空。
d3.json("filename.json", function(json) {
root = json;
root.x0 = h / 2;
root.y0 = 0;});
. . .
}
My code is basically the same as in this d3.js example
我的代码与此d3.js 示例中的代码基本相同
采纳答案by mb21
If you're running in a browser, you cannot load local files.
如果您在浏览器中运行,则无法加载本地文件。
But it's fairly easy to run a dev server, on the commandline, simply cdinto the directory with your files, then:
但是在命令行上运行开发服务器相当容易,只需cd进入包含文件的目录,然后:
python -m SimpleHTTPServer
(or python -m http.serverusing python 3)
(或python -m http.server使用 python 3)
Now in your browser, go to localhost:3000(or :8000or whatever is shown on the commandline).
现在在您的浏览器中,转到localhost:3000(或:8000命令行上显示的任何内容)。
The following used to work in older versions of d3:
以下用于在旧版本的 d3 中工作:
var json = {"my": "json"};
d3.json(json, function(json) {
root = json;
root.x0 = h / 2;
root.y0 = 0;
});
回答by bigsolom
Adding to the previous answers it's simpler to use an HTTP server provided by most Linux/ Mac machines (just by having python installed).
添加到前面的答案中,使用大多数 Linux/Mac 机器提供的 HTTP 服务器更简单(只需安装 python)。
Run the following command in the root of your project
在项目的根目录中运行以下命令
python -m SimpleHTTPServer
Then instead of accessing file://.....index.htmlopen your browser on http://localhost:8080or the port provided by running the server. This way will make the browser fetch all the files in your project without being blocked.
然后,而不是访问file://.....index.html打开浏览器http://localhost:8080或运行服务器提供的端口。这种方式将使浏览器获取您项目中的所有文件而不会被阻止。
回答by Manas
In version d3.v5, you should do it as
在 d3.v5 版本中,您应该这样做
d3.json("file.json").then(function(data){ console.log(data)});
Similarly, with csv and other file formats.
同样,使用 csv 和其他文件格式。
You can find more details at https://github.com/d3/d3/blob/master/CHANGES.md
您可以在https://github.com/d3/d3/blob/master/CHANGES.md找到更多详细信息
回答by Surendra Pratap
http://bl.ocks.org/eyaler/10586116Refer to this code, this is reading from a file and creating a graph. I also had the same problem, but later I figured out that the problem was in the json file I was using(an extra comma). If you are getting null here try printing the error you are getting, like this may be.
http://bl.ocks.org/eyaler/10586116参考此代码,这是从文件中读取并创建图形。我也遇到了同样的问题,但后来我发现问题出在我使用的 json 文件中(一个额外的逗号)。如果你在这里得到 null 尝试打印你得到的错误,就像这样。
d3.json("filename.json", function(error, graph) {
alert(error)
})
This is working in firefox, in chrome somehow its not printing the error.
这在 Firefox 中有效,在 chrome 中以某种方式不打印错误。
回答by Kenny Evitt
You can't readilyread local files, at least not in Chrome, and possibly not in other browsers either.
您无法轻松读取本地文件,至少在 Chrome 中无法读取,在其他浏览器中也可能无法读取。
The simplest workaround is to simply include your JSON data in your script file and then simply get rid of your d3.jsoncall and keep the code in the callback you pass to it.
最简单的解决方法是将您的 JSON 数据简单地包含在您的脚本文件中,然后简单地摆脱您的d3.json调用并将代码保留在您传递给它的回调中。
Your code would then look like this:
您的代码将如下所示:
json = { ... };
root = json;
root.x0 = h / 2;
root.y0 = 0;
...
回答by Aakanksha Choudhary
I have used this
我用过这个
d3.json("graph.json", function(error, xyz) {
if (error) throw error;
// the rest of my d3 graph code here
}
so you can refer to your json file by using the variable xyz and graph is the name of my local json file
所以你可以使用变量 xyz 来引用你的 json 文件,graph 是我本地 json 文件的名称

