javascript - D3 绘制数据集的选择性部分

Question

我有一个大型时间序列数据集需要绘制图表，我正在尝试使用 D3 来完成它。我计划让我的图形的 x 轴为时间，并允许图形在 x 方向上移动。我想让图表只加载/显示屏幕上当前时间范围内存在的点。

例如，如果我的数据集有 1-100 次，但图形以显示的时间 1-10 开始，则图形应该只绘制 1-10 点。然后用户可能会向右移动并查看时间 5-15，图表应相应更新。

任何人都可以向我解释如何通过 d3 完成此操作吗？我很难理解从一次加载并立即绘制整个数据集到选择性地绘制数据子集。

Answer 1

我认为您正在寻找 selection.filter()功能。例如你可以有:

var allNodes = vis.selectAll("Nodes").data(data.nodes); 
var validNodes = allNodes.filter(function(d){return (d.time>1 && d.time <10)});
//use normal graph functions on validNodes.  

您还可以直接在节点数组上应用过滤器。