[_gsTransform is always undefined]

Hi, I'm trying to read a scale value of a transform from an element, but I always get undefined.

The selector is simple as that:

document.querySelector(".logo")._gsTransform

I'm using gsap 3.

any idea?

Thanks

[TimelineMax problem with staggers and position parameter]

Damn, that was easy! 

 

thanks!

[TimelineMax problem with staggers and position parameter]

As you can see in the codepen, when I have two staggers one after another, the position parameter of the second stagger is not respected.

The second stagger always start after the first one is done.

I've tried with a label, nothing changes.

 

Anyone can shed some light? Am I missing something?

 

thanks a lot

See the Pen RzjNVb by federicovezzoli (@federicovezzoli) on CodePen

[greensock canvas animate]

Thanks @pointC

It worked pretty well with the bezier plugin, here the updated pen.

 

Thanks again!

 

See the Pen MxMxGo by federicovezzoli (@federicovezzoli) on CodePen

[greensock canvas animate]

Here it is,

I've added both the solutions: the normal way ( line 49 of the js ) commented out but it works, uncomment to see the path, it's the Danube river.

And the tween ( from line 58 ) that does not work.

 

Any clue?

thanks a lot!!

 

See the Pen MxMxGo by federicovezzoli (@federicovezzoli) on CodePen

 

 

[greensock canvas animate]

Anyone? I'm really stuck here. 

Any help could be really appreciated.

 

@PointC or @OSUblake?

 

thanks a lot guys.

[greensock canvas animate]

thank you @PointC, I've made some progress, but can't replicate it in pixi the first demo, since pixi does not have dash offset.

I thought to combine svg and webgl, but for different reasons I cannot use that technique.

 

So, I have an array of cubic bezier coords without animation I just do something like this, and it works:

 

this.tracks[trackID] = new PIXI.Graphics()
this.tracks[trackID].lineStyle(1, 0xFFFFFF)
this.tracks[trackID].moveTo(newCubicBezier[0].x,newCubicBezier[0].y)
for (var i = 1; i < newCubicBezier.length; i++) {
	this.tracks[trackID].lineTo(newCubicBezier[i].x, newCubicBezier[i].y, 1)
} 

 

But if I place it in a tween, the line is not visible:

this.tracks[trackID].moveTo(newCubicBezier[0].x,newCubicBezier[0].y)
//remove the first el
newCubicBezier.shift()
        
let that = this.tracks[trackID]
TweenMax.staggerTo(newCubicBezier, 2, {
    ease: Sine.easeOut,
    onUpdate: function(){
        console.log("update", this.target, that)
        that.lineTo(this.target.x, this.target.y, 1)
    }
}, 0.05);

 

I think I'm missing some basic understanding, but couldn't find it.

 

Wanted to do a codepen demo, but Codepen is not working right now.

 

Thanks a lot!

[greensock canvas animate]

Hi @OSUblake, is there a way to animate the stroke dash offset in pixi.js graphics elements? 

I've been banging my head on this one for a couple of days without finding the right solution.

 

Coming from svg animations the dash offset was one of my first thoughts, but couldn't find a way to do it in pixi.

 

thanks a lot.