Hey,
I have some problems with drawing the animation using pixi-tween. I want to animate a drawing of a stroke along the bezier path. I am basis on this example -> https://github.com/Nazariglez/pixi-tween/blob/master/examples/easing.html
but my code still doesn’t work. Any idea where am I wrong?
That's the code:
var app = new PIXI.Application(1200, 800, {antialias: true});
document.body.appendChild(app.view);
var raf;
function animate(){
raf = window.requestAnimationFrame(animate);
app.render(app.stage);
PIXI.tweenManager.update();
}
function stop(){
window.cancelAnimationFrame(raf);
}
var path = new PIXI.tween.TweenPath();
path.moveTo(0.4,0.4);
path.bezierCurveTo(0.4,360.5,292.29,652.4,652.4,652.4);
path.bezierCurveTo(87.5,65.4,105.9,47,105.9,24.89);
path.closed = true;
var t = new PIXI.Graphics();
app.stage.addChild(t);
var tween = PIXI.tweenManager.createTween(t);
tween.on('update', function(delta){
tween.path = path;
tween.time = 13000;
tween.easing = PIXI.tween.Easing.outBounce();
tween.loop = true;
tween.lineStyle(10, 0xff0000);
tween.drawPath(path);
tween.start();
});
animate();