在网站上创建图表的好方法是什么？

Question

我在数据库中收到了大量数据。目标是以可读的方式将它们呈现给用户，并且由于它们是库存数据，因此需要有图表。

现在它提出了一个问题：哪种方法会更好，在服务器端动态创建图形或让服务器只是推送原始数据，允许客户端生成图形？我看到有一些jQuery库用于执行此操作，例如flot。

我通常喜欢在客户端尽可能少地做，但这次我想知道：在客户端生成图表会产生较低的服务器负载。

此外，更改某些参数（如显示位差异时间跨度的数据）只需要使用ajax和重绘图从服务器获取丢失的数据，而不是获取完全不同的图像。这将提供更具响应性的UI。

我看到Google Finance使用flash作为他们的图表，但如果可能的话，我想避免使用...

Answer 1

如何使用Google Chart API？

  

Google Chart API可让您动态生成图表。要查看Chart API的运行情况，请打开浏览器窗口并将以下URL复制到地址栏中：

https://chart.apis.google.com/chart?cht=p3&chd=t:60,40&chs=250x100&chl=Hello|World

     

按Enter或Return键 - - presto！ - 您应该看到以下图片：

     

此解决方案的优点：

• 它不会在您的服务器上产生更多负载。
• 它不涉及客户。
• 图表看起来很性感（恕我直言）。

此解决方案的缺点：

• 需要互联网连接。
• 你依赖于第三方（但它是谷歌，他们有正常的正常运行时间）。
• 您将信息传递给Google，这可能是一个问题。

Answer 2

客户端图表有几个问题：

1. 对于基于Javascript / Flash的图表，您的客户必须启用javascript / flash。如果您的应用程序已经依赖于js，这不是问题。
2. 但问题是，在某个时候，你需要通过电子邮件向客户发送报告（无论是HTML电子邮件还是嵌入式PDF或者你有什么）。突然，flash / javascript完全没有帮助，所以你最终实现了服务器端图表，现在要么必须维护它们，要么重构你的UI。
3. 使用Google Charts可以避免上述两个问题;但它引入了外部依赖。你可能想要或不想要的东西。

如果以上所有内容都没有吓到你，那么客户端图表就很棒了，特别是它的互动性。

Answer 3

客户端为用户提供了更多机会。在这方面，在服务器上生成位图是非常蹩脚的，如你所提到的和，它会增加你的服务器负载。

在那种情况下，我会选择收银机。浏览器支持非常好，它不会浪费客户端资源，您可以轻松地为用户提供一些额外的功能，如放大或激活和停用部分数据。当然，flot图也看起来很不错。

Answer 4

拥有极其CPU重的JS库实际上可以阻碍用户体验（就像让我的FireFox 3.5冻结1分钟一样，而雅虎邮件的最新代码和最棒的代码做了我从未想过或不需要的东西它要做）。因此，如果您能够负担得起服务器端资源，请在服务器上执行此操作。

但是，请确保使用相同的输入数据缓存图形图像 - 它可能会在可接受和DOA服务器利用率之间产生差异。

至少，允许用户使用“精简”选项 - ala Yahoo Finance允许您切换到简单的非Flash图表或具有精简HTML界面的Google地图。

Answer 5

如果用户正在自定义图表中显示的数据，我可能会考虑在客户端绘制图表。如果图表与多个用户相关，我肯定会在服务器端生成一次并为每个人缓存它。

Answer 6

还取决于用户查看图表的重要程度，以及他们是否处于受控环境中。如果您无法确定它们是否启用了javascript，请更好地生成图形服务器端。

Answer 7

我可能只是找到一个可以使用您选择的开发语言的图表库并使用它 - 除非您有一个强大的理由来编写自己的图表系统。

如果您使用Asp.Net，那么new charting control可能是一个安全的赌注 - 它会生成图表服务器（作为图像）