最广泛支持的 (IE + Opera) JavaScript 画布/绘图库
我正在寻找一个投资组合网站，并且我想在网站上进行一些创意绘图而不使用图像。
我考虑过canvas，我真的认为它会很酷，再加上一个有趣的项目，但是，我听说IE没有兼容性（这是真的吗？）所以我不能拥有它。
然后，我考虑了拉斐尔，这似乎是迄今为止最可行的选择。
呃，还有另一个图书馆，我不记得名字了，这似乎也是一个不错的选择。
你们对 Raphaël 及其整体兼容性、功能以及其绘画能力有何看法。我浏览了文档，我认为它非常强大。
I'm looking to do a portfolio site, and I wanted to do some creative drawing on the website without using images.
I considered canvas, which I really think would be cool, plus an interesting project, however, I heard that IE has no compatibility (is that true?) so I cannot have that.
Then, I considered Raphaël, which seems like it's the most viable option thus far.
Ughh, there was another library that I can't remember the name to, which also seemed like a good option.
What do you guys think about Raphaël and its overall compatibility, and its capabilities, regarding the kinds of drawing its capable of. I was browsing through the documentation and I think it's quite powerful.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
您想在网站本身上绘制矢量图形，还是只是发布预制矢量图形？
如果是前者，请查看 svg-edit，它可以轻松地嵌入到您的网站中，并且适用于大多数浏览器（旧的 IE 版本需要 chrome 框架插件，但 svg-edit 2.6 将支持 IE9）。
如果是后者，那么可能有很多选择，以下是我想到的几个：
将 svg 提供给支持它的浏览器，并将静态图像提供给其他人
Do you want to draw the vector graphics on the site itself, or just publish premade vector graphics?
If the former, have a look at svg-edit which can easily be embedded in your site, and which works in most browsers (old IE versions require the chrome frame plugin, but IE9 will be supported by svg-edit 2.6).
If the latter then there are probably many options, here are a couple off the top of my head:
Serve svg to browsers that support it, and static images to everyone else
<object data="your.svg" type="image/svg+xml"><img src="staticyoursvg.png"></object>
那么你可以下载 Inkscape 并在其中跨浏览器绘制你想要的东西。
然后转到我的网站（下面包含工具和说明的页面）并在那里使用 SVGTOHTML 转换器。
我会在每个版本中添加更多内容。
SVG 被转换为 Raphael，并且有多种格式可供选择。
键入此内容时版本为 0.57。
http://www.irunmywebsite.com/raphael/svgsource.php
Well you could download Inkscape and draw what you want cross-browser in there.
Then go to my website (Page with tool and instructions below) and use the SVGTOHTML converter there.
I'm adding more with each release.
The SVG is conveted into Raphael and there are a couple of options as to what format you can have.
The version is at 0.57 at the point of typing this.
http://www.irunmywebsite.com/raphael/svgsource.php
IE不支持canvas的说法是不正确的。 IE9 将支持它，这与支持 SVG 的版本相同。
对于SVG开发，这取决于你想做什么。对于静态图像，您甚至可以使用 Illustrator 或 Inkscape，然后保存/导出为 SVG。如果您这样做，请记住使用 Scour [0]，因为自动生成的标记可能有点粗糙。我通常只是手工编写 SVG，除非我正在做一些复杂的事情，在这种情况下最好使用图像编辑器。
不过，没有真正好的编辑器来添加动画，所以我总是手动添加它们。像 SMIL（用于 SVG 动画）这样的东西并不难学，但有点冗长。如果您使用 SMIL，那么建议使用 FakeSMIL，它包含在 Erik 上面链接到的 SVGBoilerplate 中，因为某些浏览器缺乏对 SMIL 的支持。
如果您想使用 JS 库生成 SVG，而不是手动编写或使用编辑器，那么 Raphaël 可能是最成熟的。还有 Dojo GFX [1]。哪个最好实际上取决于个人喜好和您想要做什么。最好用一些简单的东西来尝试一下，看看你更喜欢哪一个。
[0] http://www.codedread.com/scour/
[1] http://docs.dojocampus.org/dojox/gfx
It isn’t true that IE doesn’t support canvas. IE9 will support it, which is the same version that will support SVG.
For SVG development, it depends what you want to do. For static images you can even use Illustrator or Inkscape then save/export as SVG. If you do this, remember to use Scour [0], as the auto-generated markup can be a bit crufty. I usually just write the SVG by hand, unless I'm doing something complex, in which case it is better to use a image editor.
There are no real good editors to add animations though, so I always add those by hand. Things like SMIL (used for animating SVG) are not that difficult to learn, but a bit verbose. If you use SMIL then it is recommended to use FakeSMIL, which is included in the SVGBoilerplate that Erik links to above, as some browsers have lacking support for SMIL.
If you want to use a JS library to generate the SVG rather than writing by hand or using an editor, then Raphaël is probably the most mature. There is also Dojo GFX [1]. Which is best really depends on personal preference and what you are trying to do. It would be best to try them out with something simple and see which you prefer.
[0] http://www.codedread.com/scour/
[1] http://docs.dojocampus.org/dojox/gfx
查看 SVG Web，它使用 Flash 在不支持的浏览器中模拟 SVG。它是由 Brad Neuberg 等行业领导者编写的，它不会干扰您编写 SVG 标记的方式，因此当不支持 SVG 的浏览器消失时，您可以放弃它，您的 SVG 标记仍然可以工作。使用 Raphaël，您必须编写 JavaScript 代码而不是 SVG 标记，因此您必须永远继续使用它，或者重新编码您的图形。另外，Raphaël 仅支持 SVG 和 VML 之间的最小公分母，因此您无能为力。它甚至模拟了 SVG 中的一些 VML 错误，因此两个图形看起来相同。 Raphaël 更适合动态生成 SVG，但对于其他情况，我建议使用 SVG Web。
Look into SVG Web, it uses Flash to emulate SVG in non-supporting browsers. It's written by industry leaders like Brad Neuberg and it doesn't interfere with the way you want to write SVG markup so when the browsers that don't support SVG disappear you can ditch it and your SVG markup will still work. With Raphaël, you have to to write JavaScript code instead of SVG markup, so you have to keep using it forever, or re-code your graphics. Also, Raphaël only supports the lowest common denominator between SVG and VML, so you can't do much. It even emulates some VML bugs in SVG, so that both graphics look the same. Raphaël is better for dynamically generated SVG, but for other cases, I'd recommend SVG Web.