Javascript 如果从外部数据加载,如何更新d3图形?
所以我还没有找到一个例子。我正在用D3从一个外部文件加载这个巨大的数据集,我正在用部分数据制作一些图表。当滑动条移动时,我希望用数据的其他部分制作相同的图形 我使用d3.json加载数据。我面临的问题是:由于d3.json是异步的,它只加载一次数据集,然后我无法从其他函数访问它。我不能再使用另一个更新函数来生成新的图形,因为我再也不能访问数据了 其他人的建议只是使用d3.json函数中的数据: 我尝试使用一个变量来存储上面同一问题链接的第二个答案中的数据:Javascript 如果从外部数据加载,如何更新d3图形?,javascript,d3.js,data-visualization,Javascript,D3.js,Data Visualization,所以我还没有找到一个例子。我正在用D3从一个外部文件加载这个巨大的数据集,我正在用部分数据制作一些图表。当滑动条移动时,我希望用数据的其他部分制作相同的图形 我使用d3.json加载数据。我面临的问题是:由于d3.json是异步的,它只加载一次数据集,然后我无法从其他函数访问它。我不能再使用另一个更新函数来生成新的图形,因为我再也不能访问数据了 其他人的建议只是使用d3.json函数中的数据: 我尝试使用一个变量来存储上面同一问题链接的第二个答案中的数据: var DATASET; // glo
var DATASET; // global
d3.json("file.json", function(data) {
DATASET = data;
//any other functions that depend on data
});
d3.selectAll().data(DATASET).......
我根本无法让它工作,因为我假设这就是当d3.data的最后一行调用DATASET时数据没有加载到DATASET的原因
有没有办法更新d3中的外部数据?我应该在更新函数中再次加载数据吗?由于数据集庞大,它会影响性能吗
非常感谢您的回答 如果希望一次读取所有数据,则应将其存储在全局数据集变量中,正如代码片段中所示。但是不要将更新逻辑放在主脚本流中,而是将其放在更新中。。。函数,并从d3.json回调调用该函数。。。类似这样的未经测试:
var DATASET; // global
d3.json("file.json", function(data) {
// data is loaded, save the full set
DATASET = data;
// filter the initial subset
var subdata = data.filter(...);
// now update the graph
updateGraph(subdata);
});
function updateGraph(data) {
// when invoked without any data, use the full dataset
var newdata = (data == null ? DATASET : data);
// data rendering logic starts here...
d3.selectAll().data(newdata);
...
}
这会将完整的数据集保存在全局变量中,使用过滤的数据子集绘制初始图,还允许您在再次调用函数之前使用不同的过滤器更改显示的数据
var DATASET; // global
d3.json("file.json", function(data) {
// data is loaded, save the full set
DATASET = data;
// filter the initial subset
var subdata = data.filter(...);
// now update the graph
updateGraph(subdata);
});
function updateGraph(data) {
// when invoked without any data, use the full dataset
var newdata = (data == null ? DATASET : data);
// data rendering logic starts here...
d3.selectAll().data(newdata);
...
}