如何用Snap.svg动画轮子？

当我尝试使轮子动起来时，我遇到了问题。你可以在example中看到。如何用Snap.svg动画轮子？

我读article并尝试写代码，但也许我错过了一些东西。

function moveWheels() { 
wheel_right_needles.animate({ transform: 'r0 ' + 
    getCenterPoint(wheel_right_needles) }); 

setTimeout(function() { 
    wheel_right_needles.animate({ transform: 'r90 ' + 
    getCenterPoint(wheel_right) }, 1000, function() { 
    moveWheels(); 
    }); 
}, 300); 
} 

moveWheels();

我在做什么错？

来源

2017-09-15 Slavik

我不是专家在浏览器中的SVG动画中，但将快速console.log添加到移动功能（在timeOut，第187行中）表明wheel_right的getCenterpoint未定义。 – MrKickkiller

我修好了。这里是一个小提琴（click here），您可以检查

我为如下的功能：

function moveWheels() { 
    var c=getCenterPoint(wheel_right_needles);  
    wheel_right_needles.transform("r0," + c); 
    wheel_right_needles.animate({ transform: 'r360 ' + c }, 1000, function() { 
     moveWheels(); 
    }); 
}

而且，我注意到轮动漫作品在以前的版本snapsvg的 https://cdnjs.cloudflare.com/ajax/libs/snap.svg/0.4.1/snap.svg-min.js

来源

2017-09-20 07:46:31 RashFlash

如何用Snap.svg动画轮子？

回答

相关问题