d3.csv()是一个异步方法,即在我们等待文件全部下载到浏览器的同时,其他代码会照样执行。(d3.json也是一样)
此时常见的错误,就是在回调函数外面引用外部数据——!!!为了以后的方便,最好在回调函数内部引用。
解决方法:声名一个全局变量,然后再调用d3.csv加载数据。在回调函数中,把数据复制给这个全局变量,然后再调用依赖数据显示图形的其他函数。借助全局变量保存函数,可以确保接下来调用的函数能够取到数据,即使将它们放在函数外面。
例如:
var dataset;//初始为空的全局变量
d3.csv("do.csv",function(data)){
dataset=data;
genrateVis();//调用其他依赖数据
hideLiadingMsg();//显示图形的函数
});
var useTheDataLater=function(){
//假设此函数在csv()加载数据成功后的某一时刻被调用,那时可访问全局变量dataset。
};
有时候,回调函数可能加载数据不成功也会继续执行,此时提供一个debug小方法:
var dataset;//初始为空的全局变量
d3.csv("do.csv",function(error,data)){
if(error){
//如果error非null,则出错
console.log(error)//输出错误信息
}
else{
console.log(data)
dataset=data;
genrateVis();//调用其他依赖数据
hideLiadingMsg();//显示图形的函数
}
});
var useTheDataLater=function(){
//假设此函数在csv()加载数据成功后的某一时刻被调用,那时可访问全局变量dataset。
};