javascript - 适用于真正海量数据的最快 javascript 图表库

Question

关闭。这个问题需要多问 focused 。目前不接受答案。

---

想要改进此问题吗？更新问题，使其仅关注一个问题 editing this post .

已关闭 8 年前。

Improve this question

我需要开发一个 ASP.NET Web 应用程序(不是 MVC)，它显示使用海量数据源(例如图表有 10 亿条记录)生成的图表。

图表应至少具有以下 2 个功能:

• 缩放 + 平移缩放图表
• 鼠标悬停显示点的汇总数据

所需的图表类型:

• 折线图
• 条形图/柱形图
• 饼图
• 面积图(不是必需的)
• 气泡图(不是必需的)
• 以及图表类型的组合:
  • 柱形图+折线图
  • 面积图+折线图(不是必须的)
  • 气泡图+饼图(不是必需的)

支持的浏览器:

• 现代版本的 Chrome、Firefox、Opera、Safari(不是必需的)
• IE 7+

我想到的可能的解决方案:

• 服务器端图表图像生成:该解决方案性能良好，但没有提供足够的图表功能。
• 基于 Javascript 的图表:这个解决方案有很多库，但其中大多数都没有提供足够的性能(据我从研究中了解到)。我发现的东西:
  • canvasjs
  • 图文
  • 谷歌图表
  • 高图表
  • amcharts
  • jqchart
  • d3js
• 在服务器上生成图像，使用 javascript 操作它:这个解决方案可能会做到这一点，但我找不到任何像这样工作的库。我不知道如果我们决定开发这个会花费多少时间。

最重要的是图表生成和互联网浏览器的性能。用户体验是关键。

我应该选择哪个方向？

Answer 1

基于 JavaScript 的图表将满足您的功能要求。

虽然 D3 可以制作您所需的图表类型并实现缩放、平移和悬停效果，但您需要大量的构建时间来创建所有可能的用户交互。因此，“商店购买”选项可能更具成本效益。

但是，即使在渲染如此大的数据集时使用 D3 这样强大的选项，您也肯定会遇到一些问题。

如果您的目标是提供交互式网络图表，那么您首先考虑的应该是数据采样的位置。您必须进行采样:监视器无法显示 10 亿个单独的数据点。此外，将 10 亿个数据点从服务器传输到客户端将需要大量的数据传输加载时间。

那么这会让你做什么呢？我在您的列表中没有看到的一个 JavaScript 图表库是 ZingChart ，这将满足所有这些要求。我们使用过类似大小的数据集，当然可以提出有关采样的建议。一个只是针对性能，另一个是准确性。

• 使用精确:false 采样将是最快的选择。
• 智能采样将评估节点之间的空间差异。如果连续节点相距超过 x 像素，则显示该节点。这可确保数据中的离群值和异常情况不会被删除。

为了解决浏览器中的渲染问题，ZingChart 提供了 SVG、HTML5 Canvas 和 VML 选项。 SVG 和 Canvas 都有好处，但对于这种大小的数据集，Canvas 提供了多个好处(特别是如果您需要渲染具有大型数据集的条形图)。该库是在与其他具有大型数据集的产品一起工作时遇到的挫折而构建的，它能够在客户端上渲染数十万个节点(无需采样)。

ZingChart 还提供交互功能，允许最终用户导航数据并进行可视化查询。该 API 非常强大，允许您以编程方式或响应用户事件来控制可视化的每个部分。

您可能对 Node.js 库特别感兴趣。这是一个服务器端图像生成库，其工作代码库与 ZingChart 的 Canvas 客户端库非常相似。它包括图像映射功能和我们的服务器端构建，提供一定程度的交互性。另外，在服务器和客户端上提供相同的图表还有一个好处。这在处理如此大的数据集时提供了一些有趣的用户体验机会。

我是 ZingChart 团队的成员，因此，如果您对我们的答案与您现在正在权衡的可能解决方案之间的关系有任何疑问，请随时与我们联系。