【发布时间】：2013-09-06 20:24:38
【问题描述】：
我需要用 KineticJS 绘制动画 gif，但是当我关注 image tutorial 时失败了。有什么方法可以画gif动画吗？
【问题讨论】：
标签： kineticjs
【发布时间】：2013-09-06 20:24:38
【问题描述】：
使用 KineticJS Sprite。
动画 GIF 是（非常）古老的方法。它不能很好地工作，它在性能方面非常不稳定并且在不同的浏览器中不一致。当同时显示大量动画 GIF 并减慢一切时，它也会消耗内存。信不信由你，最好用代码而不是在图像文件中处理动画。
我建议使用 PNG 格式。您应该使用包含所有动画帧的单个 PNG 文件（精灵表）。然后将它们加载到一个数组中并使用 KineticJS Sprite 来显示它。这相当简单。你有一个包含所有你需要的精灵。这里有一个很好的例子：
【讨论】：
不直接。
你可以这样做：
- 将 .gif 拆分为单独的图像：http://gif-explode.com/
- 将这些图像加载到 javascript 数组中。
- 创建 Kinetic.Image。
- 枚举数组中的每个图像。
- 将 Kinetic 图像中的图像替换为枚举数组图像。
- 使用 myKineticImage.setImage(images[nextImage++]) 设置下一张图片。
【讨论】：
-
为什么不使用 KineticJS Sprite？
-
这也有效......欧文给出了这样一个答案。 :-)
-
是否也可以使用 SVG Sprites 而不是 PNG Sprites？在这种情况下我需要改变什么吗？
-
SVG sprite-stacks 非常有用，但 KineticJS 需要光栅图像，因此不支持 SVG sprite。
-
是否可以将 SVG 精灵转换为 PNG 精灵，然后与 KineticJS 一起使用？