且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

如何使用 snap.svg 为路径变形设置动画

更新时间:2023-10-28 22:58:52

不太确定您的意思是只想要 Snap 中的当前动画还是其他动画.只是举个例子说明一个人通常会如何做一些动画......

Not quite sure if you mean you just want the current animation in Snap or something different. Just to give an example of how one would typically do some animation...

s = Snap(400, 620);

var path = s.path("M94.2,265.7L82,203.4c43.3-15.6,83.8-29.2,137.1-20.2c61.5-27.6,126.1-56.9,202.6 46.1c18.7,18.9,21.5,39.8,12.2,62.3C322.7,231.9,208.2,247.6,94.2,265.7z");

path.animate({ d: "M179.4,83.5l62.4-11.8c15.3,43.4-76,102.6-22.6,111.5c61.5-27.6,126.1-56.9,202.6-46.1c18.7,18.9,21.5,39.8,12.2,62.3C250.6,296.7,52.4,259.2,179.4,83.5z" }, 1000, mina.bounce);

jsfiddle

从/到的路径上需要有相同数量的点.

There needs to be the same amount of points on the path to morph from/to.