我试图动画我的椭圆形图像以固定角度旋转,以便轮廓围绕一个区域旋转而不改变区域的形状.
我怎么做？我可以只使用一个图像,还是需要一个椭圆形路径后的几个小图像？
这就是我所做的(jsfiddle),因为你可以看到该区域正在根据旋转改变形状
最佳答案
我不是一个图形天才,但我很确定这不能用你拥有的东西来完成.如果你带走动画并检查PNG本身,你会注意到齿轮已经以固定的two-point perspective方式扭曲了 – 齿轮正在向我们的观察者“拉开”.
但是图像本身就是2D,无论你如何在SVG或CSS或Canvas中旋转它,齿轮都会以相同的方式伸展.
如果有解决方案,则会在动画中的关键点处涉及一些严重的图像变形,并且在光栅化图像上执行变形将始终降低视觉保真度.
以下是一些替代方案：
>有一个很好的旧待机：GIF动画的齿轮执行完整旋转的3D动画.
>您可以将3D动画切割成一系列2D帧,然后将它们粉碎成精灵表,然后使用JavaScript对其进行动画处理.
>你可以使用Flash.
>您可以尝试使用WebGL.
