cross-browser - 在浏览器中显示矢量图形

Question

我需要在我正在处理的网站中显示一些交互式(附加 DOM 监听器等和事件处理)矢量图形。 W3C 推荐了 SVG，尽管 Internet Explorer 支持仍然无法识别这种格式，这是必须的(对于公共(public)网站)。 IE 处理 VML，甚至还有一些 JavaScript 库可以根据浏览器(SVG 与 VML)进行一些类似 Canvas 的绘图 - excanvas , GFX of Dojo Toolkit和更多。尽管它们都不能从给定的标记中显示 SVG 图像，但这会很好并且可以接受。

所以这个问题实际上由几个部分组成:

是否有任何跨浏览器 Javascript 库可以显示来自给定标记(不是强制性 SVG)的矢量图形并提供附加到 DOM 事件的可用性？

如果没有，哪种最流行的嵌入式浏览器技术最适合做这样的任务？我可以从 Flex/Flash、Java 小程序中进行选择。由于 Windows 锁定，Silverlight 不是一个选项。

[ 编辑 ] 谢谢大家的意见/建议。以下只是我对此事的一些随机笔记/结论:

我需要的交互性级别是能够检测正在显示的矢量图像上的 DOM 事件——鼠标悬停、鼠标悬停、单击等——以及对它们使用react的能力，比如改变背景颜色、显示对话框等。

坚持使用 SVG 格式的想法非常好，因为它在许多浏览器上都是原生的，除了最流行的浏览器 - IE。在尝试显示动态 SVG 之后，我意识到 IE 版本 7 是最有问题的。由于浏览器不兼容，有太多麻烦。

Cake 似乎是一个很棒的 Javascript 框架，尽管我无法获得在 IE7 上运行的示例。

Java Applets - 我最喜欢这个想法，因为我可以使用 Apache Batik 库，一个高质量的 SVG 渲染器。但是，Batik 是一个非常大的库，我负担不起部署一个只有几兆字节的小程序。

我决定坚持使用 Flex 选项。我找到了一个不错的矢量图形库Degrafa .它使用自己的标记格式，但是它识别 SVG 路径表示法，因此在我的情况下，使用 XSLT 转换我的 SVG 或仅解析它们将非常容易。

[ 编辑 2 ] 出现了更多评论。我想澄清一下，“Windows 锁定”是指 Silverlight 通常在 Windows 上运行的情况，更具体地说，是 IE。我怀疑它是否是其他系统上可接受的解决方案(例如 Flash 或 Java Applet)。是的，我毫不怀疑可以在任何系统上启动 Silverlight 应用程序，尽管我担心这对普通用户来说会花费太多精力。

@Akira:您对 IE7 上的那些“SVG 渲染器”有什么问题吗？我总是抛出 Javascript 错误。

Answer 1

Safari、Opera 和 Firefox 都以不同程度的完整性和正确性原生支持 SVG(例如，没有插件)，包括从 javascript 编写 svg 脚本的能力。

还有 canvas 元素，它现在在 html5 中被标准化，并且已经在上述浏览器中得到支持(由于 html5 草案中相对较新的变化，在某些边缘情况下存在各种怪癖)。

不幸的是，任何基于标准的方法都被 IE 故意无视其自身生态系统之外发生的事情所破坏，但是有许多库试图将 canvas/svg 转换为 VML(IE 的专有矢量语言)，例如 iecanvas .

[编辑:哎呀，我忘记了我最喜欢的 js 库——Cake !它可以在 Canvas 中解析和显示svg，并且相信也支持IE]

[另一个编辑:Cake 实际上有一个 demo做我认为你想做的事]