用 Javascript 绘制形状答案

【问题标题】：Painting shapes in Javascript用 Javascript 绘制形状
【发布时间】：2009-06-04 08:27:57
【问题描述】：

除了 html5 元素画布之外，还有什么好的替代方法可以使用 javascript 绘制六边形等形状，并且可以跨浏览器（包括可怕的 IE6）工作？

为此我一直在使用 jQuery 和 jQuery maphighlight，但它并没有给我足够的可能性来在第一次渲染后操纵形状和颜色。

我是否缺少 jQuery maphighlight 中的某些功能，或者是否有任何其他 jQuery 或 mootools 插件可以为我提供这种绘画功能？

【问题讨论】：

【解决方案1】：

你应该看看 RaphaelJS。它是一个围绕 Canvas、SVG 和 VML（早于 SVG，在 IE6 中使用的仅限 IE 的矢量标记语言）的 JavaScript、跨浏览器包装库。使用 RaphaelJS，您可以使用与非常广泛的浏览器兼容的 JS 生成非常广泛的矢量图形。

RaphaelJS 也与 jQuery 非常兼容，并遵循许多与 jQuery 相同的调用链。两人是绝配。

【讨论】：

它是一个很棒的图书馆。我曾多次使用它来创建简单的基于 javascript 的图形、图表和图表。它很简单，并没有为您提供 Canvas、SVG 和/或 VML 的全套功能……但它足以在大多数情况下有用。
这太棒了，它确实解决了我的问题：D

【解决方案2】：

还有著名的油画家。

【讨论】：

【解决方案3】：

试试Raphael。

Raphaël 目前支持 Firefox 3.0+、Safari 3.0+、Opera 9.5+、Chrome 2.0+ 和 Internet Explorer 6.0+。

【讨论】：

【解决方案4】：

我总是喜欢 javascript 的 prossessing 端口。你可以发现here 画东西很不错。也许你可以检查一下。它不是 jquery 的插件，但它非常强大。

它确实使用了 HTML5 Canvas 元素 :(

在几个版本之前，它只适用于新的浏览器。不知道是不是已经移植到以前的了。

我发现的另一个使用 div 进行绘图的 API 是 this one 如果你想绘制有限的东西，可以使用它。但要小心，当绘制数量增加时，HTML 的结构会变得有点沉重

【讨论】：

【解决方案5】：

您可以使用在 Ample SDK 中找到的 SVG 实现，该实现也适用于 Internet Explorer。您将获得基于标准的 API（DOM 级别 2/3）和标记符号（SVG1.2 Tiny）。

这里有两个例子：

【讨论】：