D3.js的最大数据文件大小

Question

D3js的数据文件大小的限制因素是什么？是文件从服务器加载到客户端需要多长时间？

我正在尝试创建一个芝加哥的路线图，在那里你可以将鼠标悬停在路上以获得它的名字并突出显示它。该文件的大小为125 MB。我通过删除不必要的信息将其剥离到30 MB，然后将其转换为TopoJSON文件，将其降至5.1 MB。这是一个不守规矩的文件大小？

Answer 1

处理大量数据时有三个限制因素：

• 要加载的文件大小以及服务器/客户端的连接速度。
• 要对数据进行的处理。
• 呈现代表数据的视觉元素。

如果没有关于你的应用程序的更多细节，很难猜出它是哪一个，但根据我的经验，它几乎总是第三个。元素的渲染通常占用显示可视化的大部分时间。

浏览器中的调试/ Web开发工具可以让您更好地了解瓶颈的位置;特别是你应该能够很容易地发现加载JSON需要多长时间。如果这比显示可视化的时间短得多，问题几乎肯定是元素的渲染。

在这种情况下，您可以做两件事。您可以减少显示的元素数量（例如通过聚合），也可以切换到不同的渲染机制。特别是，canvas渲染速度明显快于SVG。如果你进行了那次切换，你会失去SVG非常容易的交互性，所以这是一个取决于你的特定应用程序的权衡。