javascript - 制作占用空间很小的“简单”折线图的最佳方法是什么？jQuery？帆布？

Question

我正在尝试创建如下图所示的折线图。线形图

它需要有一个非常轻的重量（以 kb 为单位），并且需要有我可以悬停的点（关于该点的工具提示，如图像中所示）。我不需要饼图或类似的东西，只需要像上面这样的折线图。

我只是不确定如何最好地去做，我不知道画布，我假设尝试用画布做我需要的事情可能会非常复杂。我非常了解 jQuery。

我想知道：是否有一个非常轻量级的框架/插件可以让我只做图像中的基本要素？如果没有，你会如何建议使用 jQuery 来解决这个问题？

我所需要的只是绘制的线条，以及可以触发悬停的点，我可以处理工具提示以及所有这些，我只是想弄清楚如何绘制与网格匹配的所有线条，并将小圆圈元素放在正确的位置。

非常感谢。ps：对我来说轻量级不超过几kb，因为我希望它们是交互式的（不仅仅是静态图像），但我不会有那么多我需要一个巨大的jquery插件，只是小东西。

另外：我正在努力使它具有响应性，并缩小以适合手机屏幕。

score 1 · Accepted Answer

Google Chart API 非常可靠且易于使用。这是一个简单的折线图示例 http://code.google.com/apis/ajax/playground/?type=visualization#line_chart

您还可以与您创建的图表进行交互：

score 1 · Accepted Answer

SVG 听起来就像您正在寻找的一样。您可以使用诸如 JQuery SVG 或 Raphael（基于 Prototype.js）之类的库来简化它。

score 0 · Accepted Answer

查看谷歌图表。它看起来像完美的东西。它不使用闪光灯，所以它比一些小，并且有工具提示。作为奖励，您可以使用网络上的实时数据。

score 0 · Accepted Answer

0

如果您不打算对图表进行任何操作。使用名为pChart的 PHP 库

于 2012-04-04T00:09:51.020 回答

score 0 · Accepted Answer

0

对于我通常会使用的那种东西，我不知道你能做你想做的事情有多轻巧。

于 2012-04-03T23:41:43.153 回答

5 回答 5