画布与SVG动画（效果[过滤器]和性能）

我正在开发一个应用程序，应该在Web浏览器（IE支持完全可选）和iPhone上同样流畅地运行，并测试了多种库，包括：jQuery SVG ，CAKE（画布动画工具包实验），Burst Engine，Processing.js和Raphael，还没有找到合适的实验。画布与SVG动画（效果[过滤器]和性能）

输入是可选的 - 无论是从矢量渲染的SVG还是PNG，动画库的唯一两个要求是能够动画（旋转）图像，并逐渐应用模糊滤镜或“尾迹“的效果。

我应该去SVG或帆布，性能和前面提到的影响？

此前该项目在Flash中，但关于iPhone支持的趋势和缺乏，我决定切换到更先进的软件。

来源

2010-09-30 laVie

在这里，您可以自己比较过滤器性能svg和canvas。另一个例子展示了如何做一个svg 3d lighting effect VS canvas 3d lighting effect

有超过在chromeexperiments许多不错的演示，展示既帆布和SVG。有svg-wow.org或多或少有相同的。

来源

2010-09-30 21:48:07

谢谢，看来Canvas可能在这个实验中更具性能。虽然我一直没有找到任何例子或参考动画模糊过滤器（既增加和减少模糊量） - 你碰巧知道任何？因为我在前面的项目实现中使用了Flash，所以SVG看起来更加直观，但是在模糊和旋转是不同图层上的对象的动画属性 - 你能给我一些关于如何实现它的例子使用Canvas的功能？（使用旋转和滤镜独立动画的多个对象） – laVie 2010-10-02 17:47:23

以下是模糊动画的示例：http://svg-wow.org/blog/2009/10/04/fast-blur/。该特定版本需要SMIL动画支持，但尚未在所有浏览器中使用（我建议在Opera中运行它）。但是，可以使用javascript更改'stdDeviation'属性，并且在支持svg过滤器的浏览器中应该可以正常工作。 – 2010-10-03 10:14:13

另外我对性能感到惊讶，因为svg版本在我尝试过的每个实例中都快得多（基本上是C++代码vs javascript）。尝试了几个不同的浏览器？ – 2010-10-03 10:23:56

画布与SVG动画（效果[过滤器]和性能）

回答

相关问题