Animating SVG Polygon Points using attrPlugin
Hey all,
Got a bit of a quandary going here.
So what I'd like to be able to do is to move the points of a polygon contained within a mask a variable amount (in this demo, 400 pts).
A pen can be found here: (FF only) codepen.io/johnblazek/pen/CqEpd
I'm using the attrPlugin, and adjusting the x/y coordinates within the point, but I'm getting no luck.
Could the fact I'm using this as a mask be messin me up?
Hi francolsromain,
Welcome to the GreenSock forums.
Yes you could stagger the animation of the points but it isn't something that will happen automatically. You will have to animate your own point objects with x and y properties and then apply those values to your path when the tweens update. Using the cycle feature of staggerTo() it could look something like this:
var points= [
{x:0, y:200, endX:100, endY:50},
{x:200, y:200, endX:400, endY:0},
{x:500, y:200, endX:600, endY:1
