d3 .tsv文件不工作 [英] d3 .tsv file does not work
问题描述
您好，我刚刚开始使用d3作为数据可视化工具，我正在学习以下教程： http ：//bost.ocks.org/mike/bar/
Hi i have just started on using d3 as a data visualisation tool and I was following this tutorial: http://bost.ocks.org/mike/bar/
但是，我的代码：
<!DOCTYPE html>
<meta charset="utf-8">
<style>
.chart rect {
fill: steelblue;
}
.chart text {
fill: white;
font: 10px sans-serif;
text-anchor: end;
}
</style>
<svg class="chart"></svg>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script>
var width = 420,
barHeight = 20;
var x = d3.scale.linear()
.range([0, width]);
var chart = d3.select(".chart")
.attr("width", width);
d3.tsv("data.tsv", type, function(error, data) {
x.domain([0, d3.max(data, function(d) { return d.value; })]);
chart.attr("height", barHeight * data.length);
var bar = chart.selectAll("g")
.data(data)
.enter().append("g")
.attr("transform", function(d, i) { return "translate(0," + i * barHeight + ")"; });
bar.append("rect")
.attr("width", function(d) { return x(d.value); })
.attr("height", barHeight - 1);
bar.append("text")
.attr("x", function(d) { return x(d.value) - 3; })
.attr("y", barHeight / 2)
.attr("dy", ".35em")
.text(function(d) { return d.value; });
});
function type(d) {
d.value = +d.value; // coerce to number
return d;
}
</script>
其中教程指出使用d3.tsv不工作，与harrd编码的html相比。任何人都可以在这方面有一些光吗？我已将 data.tsv 文件放在同一个文件夹中。
where the tutorial says to use d3.tsv does not work, as compared to a harrd coded html. can anyone shed some light on this? I've placed the data.tsv file in the same folder already.
这是我的.tsv文件：
This is my .tsv file:
name value
Locke 4
Reyes 8
Ford 15
Jarrah 16
Shephard 23
Kwon 42
推荐答案
如果您从计算机加载tsv文件时使用chrome，则需要按照在文档中
If you are loading the tsv file with chrome from your computer, you need to setup a server on your computer as explained in the documentation
在本地开发时，请注意，浏览器可能会强制执行
权限以读取文件退出本地文件系统。如果你在本地使用
d3.xhr（包括d3.json等），你必须有一个本地web
服务器。例如，你可以运行Python的内置服务器：
When developing locally, note that your browser may enforce strict permissions for reading files out of the local file system. If you use d3.xhr locally (including d3.json et al.), you must have a local web server. For example, you can run Python's built-in server:
python -m SimpleHTTPServer 8888 &
这篇关于d3 .tsv文件不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
