关于生成svg图表的示例

Question

我必须生成一些图形字符，现在我已经使用了pChart util。我正在考虑从现在开始使用基于svg的图形，因为鼠标事件似乎更容易处理。

我看过拉斐尔的js示例和svgweb库，但我没有找到任何关于如何使用svgweb来制作图表的示例。

1)你知道我在哪里可以看到一些关于如何使用svgweb生成图表的示例吗？

2)你认为我是应该继续使用pChart，还是应该逐步取代它在我的应用中的使用？

Answer 1

如果你不喜欢使用pChart，你可以看看Google Charts API。似乎也有一些php包装器(here、gchartphp和here)，如果你想这样使用它的话。

Answer 2

SVG Web使用Flash在不符合SVG的浏览器中呈现SVG。为了确保你的SVG graphis可以在95%的网络上运行，你可以使用SVGWeb，IE9，并且所有的现代浏览器都支持SVG，所以你可能不需要SVGweb。但是这里还有很多其他的库可以提供帮助：

JQuery SVG：http://keith-wood.name/svggraphRef.html协议：http://vis.stanford.edu/protovis/

Answer 3

首先要澄清的是：Svgweb不生成图表。

svgweb是一个SVG兼容性填充程序。它接收现有的SVG并处理在不支持SVG的浏览器中呈现它(使用JS和Flash的巧妙组合)。

所以..。要使用svgweb，您将需要一些其他方法来生成SVG图表-服务器端、客户端、Google Charts。

我简单地看了一下pChart，它似乎不能呈现SVG，所以您需要找到另一个图表工具。这里有几个来自网络的(可能还有更多可行的选择)：

• http://www.liquidx.net/plotkit/ -客户端SVG charts
• http://www.amcharts.com/javascript -客户端SVG charts
• http://xmlgraphics.apache.org/batik/uses.html -服务器端Java SVG渲染器(对于您的目的来说可能太低级了)

svgweb上的一个很好的入门读物是this alistapart article。他们的示例使用了现有的/手工制作的SVG。您的可能是动态的，但总体思想是相同的。

抛开这一切不谈，我认为你只需要看看你提到的 就可以了。你可以将IE兼容性和图表创建整合到一个优雅的包中，而且鼠标事件也是小菜一碟。

大多数图表类型开箱即可很好地处理，但您始终可以自定义一些额外的工作，利用基本的拉斐尔对象。您可能已经看到了这一点，但这里是必要的alistapart概述：http://www.alistapart.com/articles/svg-with-a-little-help-from-raphael/