我的数据都在一个长格式的CSV文件中,我希望用户能够选择他们想要可视化的国家/地区的数据。为此,我在 D3.js 中使用了过滤器函数。当他们选择一个国家/地区作为输入时,程序将过滤掉与"国家/地区名称"列中的输入不匹配的所有行。然后,它将可视化过滤后的数据。
我希望这样的事情会奏效。
data = data.filter(function(d) { return d.CountryName === "China"});
然而,当我这样做时,我得到"data.filter 不是一个函数"。 我已经看到了成功使用 data.filter 的 d3.js 代码...为什么在这里不起作用?
附加信息:
其中一条评论问数据是什么。以下是我对数据的看法:
data = d3.csv("econDataLong.csv", function(d) {
return {
CountryName: d.CountryName,
IndicatorName: d.IndicatorName,
Year: d.Year,
Value: +d.Value
} }
);
filtered = data.filter(function(d) { return d.CountryName === "China"});
console.log(filtered);
我一直在这样做,看看我是否可以让过滤器工作,但到目前为止还没有运气。
让我们看看 d3 的文档.csv (https://d3-wiki.readthedocs.io/zh_CN/master/CSV/(。他们说d3.csv(url[[, accessor], callback])
.
您提供 url 和访问器,但没有回调。有几种方法可以做你想做的事,这是其中之一。请记住,d3.csv
是异步的,因此代码不一定是从上到下执行的。
data = d3.csv("econDataLong.csv", function(d) {
return {
CountryName: d.CountryName,
IndicatorName: d.IndicatorName,
Year: d.Year,
Value: +d.Value
}
filtered = data.filter(function(d) { return d.CountryName === "China"});
console.log(filtered);
});
更多示例可在 http://learnjsdata.com/read_data.html