[英]Copy data from csv into array in D3
我知道之前已经问过这个问题,但他们的解决方案由于某些原因不适合我。
我试图用CSV文件中的数据填充两个数组,其中:
name,value
alpha,34
beta,12
delta,49
gamma,89
我现在正在尝试的是
var field1=[];
var field2=[];
d3.csv("data.csv",function(csv){
csv.map(function(d){
field1.push(d.name);
field2.push(+d.value);
})
});
console.log("field1",field1);
console.log("field2",field2);
当我在浏览器上查看控制台时,我看到:
field1 Array [] field2 Array []
哪里:
field1:
Array[0]
0:"alpha"
1:"beta"
2:"delta"
3:"gamma"
field2:
Array[0]
0:34
1:12
2:49
3:89
但是当我尝试访问field1 [0]时,我得到的值是undefined
field1 undefined
我猜想发生的事情是field1数组有一个“name”列的数组数组,但我也无法通过field [0] [0]访问第一个元素。 我得到的是:
TypeError: field1[0] is undefined
我是JavaScript的新手,我似乎不明白为什么数组没有正确填充为1维数组或者我做错了什么。 我知道我可以在每行访问csv时遍历每一行,但我想将csv值存储在数组中,以便在脚本中全局使用。
我经历的链接是:
但我似乎失踪或忽视了一些东西..请帮忙!
原因是
d3.csv("data.csv",function(csv){
是一个ajax调用,所以你不能写下面的东西(你的控制台日志在ajax完成之前调用,所以你会得到意想不到的结果) :
var field1=[];
var field2=[];
d3.csv("data.csv",function(csv){
//executed after successful loading of data
csv.map(function(d){
field1.push(d.name);
field2.push(+d.value);
})
});
//called before the loading of AJAX call got completed
console.log("field1",field1);
console.log("field2",field2);
正确的方法是:
var field1=[];
var field2=[];
d3.csv("data.csv",function(csv){
csv.map(function(d){
field1.push(d.name);
field2.push(+d.value);
})
//called after the AJAX is success
console.log("field1",field1);
console.log("field2",field2);
console.log("field1",field1[0]);
});
在这里工作代码
希望这可以帮助!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.