D3 Scatterplot具有数千个数据点

Question

我想使用D3制作散点图,只能使用x轴上的某种滑块一次查看一小部分.在javascript中是否有一个方法可以有效地缓冲数据并在用户向左或向右滚动时快速访问元素？

我的目标是类似于此protovis例子在这里,但数据的10倍.当我制作那么多数据点时,这个例子会窒息.

Answer 1

我做了一个大约10k点的散点图,我需要以交互方式过滤部分图.我分享了一系列对我有用的提示,希望有些人可能也会对你有所帮助:

• .data()在本教程结束时,请为您的操作员使用键功能.使用密钥的优点是您不需要更新不会更改的元素.
• 与d3无关,但我将数据空间划分为网格,以便每个数据点与单个单元格相关联(换句话说,每个单元格都是一组点的索引).通过这种方式,当我需要从x_0到x_1进行访问时,我知道我需要什么单元格,因此我可以访问更精确的可能数据点集(避免沿所有点迭代).
• 避免转换:从我的个人经验.transition()来看,当选择了数千个SVG元素时,它不是很平滑(现在在较新的版本或更快的处理器中可能会更好)
• 在我的情况下,使点不可见(.attr("display","none"))或可见而不是删除和创建SVG元素更方便(我想知道这是否也更节省时间)