raphael.js 与 paper.js
raphael.js 和 paper.js 之间的主要区别是什么？
还有其他我应该看的库吗？有类似的更关注 CSS3 而不是 SVG 的吗？
谢谢！
What are the main differences between raphael.js and paper.js?
Are there any other libs out there I should look at? Any like these that focus more on CSS3 then SVG?
Thanks!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
拉斐尔使用 SVG。纸张使用帆布。
这是主要的区别。
就您可以使用它们做什么而言，Canvas 和 SVG 各有自己的位置，并且适合不同的事情（尽管如果您要求它们也能够完成彼此的事情）。从纯粹的功能角度来看，在决定使用哪个库之前，您需要考虑要使用该库做什么。
无论您使用哪种浏览器，浏览器兼容性都将是一个大问题。事实上，这可能是比功能更大的问题。
Raphael 在桌面上具有优势，因为它可以检测旧版本的 IE（早至 IE6）并回退到使用 VML 而不是 SVG。这意味着它在几乎所有桌面浏览器上都具有出色的兼容性。旧版 IE 根本不支持 Canvas，而且 Paper.js 人们似乎并不支持太担心了。
但在移动设备上，Paper.js 可能更好，因为 Canvas 在移动设备上的支持比 SVG 好得多。大多数 Android 设备根本不支持 SVG。这种情况正在发生变化：Android 3.0 引入了 SVG 支持，但即使现在销售的大多数 Android 设备都配备了 v2.x，因此您还需要一段时间才能在移动设备上依赖 SVG。
有关浏览器支持的详细信息，请参阅 CanIUse 站点：
希望有所帮助。
Raphael uses SVG. Paper use Canvas.
That's the major difference.
In terms of what you can do with them, Canvas and SVG each have their own place, and are good for different things (although they are both capable of doing each other's thing as well if you ask them to). From a purely functional point of view, you need to consider what you want to do with the library before you decide which one you go with.
Browser compatibility is going to be a big issue, whichever one you use. This will possibly be a bigger issue than functionality, in fact.
Raphael has an advantage on the desktop because it detects older versions of IE (as far back as IE6) and falls back to using VML instead of SVG. This means it has excellent compatibility on virtualyl all desktop browsers. Canvas simply isn't supported on older IEs, and the Paper.js people don't really seem too worried about it.
But on mobiles, Paper.js may be better, because Canvas has much better support on mobiles than SVG. SVG isn't supported on most Android devices at all. This is changing: Android 3.0 introduced SVG support, but most Android devices being sold even now come with v2.x, so it'll be a while before you can rely on SVG working on a mobile.
For more info about browser support, see the CanIUse site:
Hope that helps.
最明显的区别是 Raphael 的目标是 SVG，而 Paper 的目标是 Canvas 元素。 Paper 似乎还具有更高级的功能，而 Raphael 只是核心 SVG 元素，可以通过插件进行扩展。可以说，这更多地取决于您的需求以及您希望针对的环境。 Canvas 在某些移动浏览器上运行良好，而 SVG 几乎无法在移动环境中运行。
另一个旁注：据我所知，SVG 在 IE (9) 或 Firefox 中不是硬件加速的，而且，如果我没记错的话，Canvas 是，至少在 IE (9) 中是这样的。对于 IE 8 及更低版本，您需要一个浏览器插件，大多数浏览器插件都有，但它是一个依赖项。
The most obvious difference is that Raphael targets SVG, and Paper targets the Canvas element. It also appears that Paper has far greater advanced features, whereas Raphael is just core SVG elements, which can then be expanded upon with plugins. Arguably, it depends more on your need, and which environments you wish to target. Canvas works well on some mobile browsers, SVG barely works on mobile environments at all.
As another side note: SVG, as I'm aware of it, is not hardware-accelerated in IE (9) or Firefox, and, again if my memory isn't failing me, Canvas is, at least in IE (9). As for IE 8 and below, you need a browser plugin, which most have, but it is a dependency to expect.
是的，您应该看看 processing.js！
顺便说一句 - 这是 raphael.js、paper.js 和processing.js 之间的出色比较：
http://coding.smashingmagazine.com/2012/02/22 /web-drawing-throwdown-paper-processing-raphael/
甚至是相同效果的代码对比：
http://zgrossbart.github.com/3gears/
Yes, you should have a look at processing.js!
And by the way - here is an excellent comparison between raphael.js, paper.js and processing.js:
http://coding.smashingmagazine.com/2012/02/22/web-drawing-throwdown-paper-processing-raphael/
And even code comparison of the same effect:
http://zgrossbart.github.com/3gears/
如果您有 Flash 开发经验，您可以考虑使用 easel.js，它为您提供了一些 Flash 显示机制。对我来说，画架看起来是一个非常好的库。
另一个有趣的库是processingjs，与其他库不同，processingjs 也可以做 3D 的东西。 （它也擅长 2D。）与纸张不同，raphael 和画架处理不能处理开箱即用的用户交互。
这两个库都使用画布。
If you have experience in Flash development you might consider easel.js which provides you with some of the flash display mechanisms. Easel looks like a really nice lib to me.
Another interesting library is processingjs, unlike the other libs processingjs also does 3d stuff. (It's also good at 2d.) Unlike paper, raphael and easel processing doesn't handle user interaction out of the box.
Both libraries use canvas.