Tween on a circle

[Drew]

So, I'm trying to create a pinging type effect in my game, basically I want a circle to show up in location, and get bigger.  My issue is that as the circle gets bigger, so does the lineWidth of the circle (though, the actual line width value in phaser is remaining the same.

    circle = this.game.add.graphics(100,100);
    circle.lineStyle(2, 0xffff00);  
    var ping = circle.drawCircle(0, 0, 10);
    ping.anchor.set(0.5, 0.5);
    
    var circleTween = this.game.add.tween(ping)
        .to({height: 300, width: 300}, 1000, Phaser.Easing.Linear.None, true, 0, 0);

Any thoughts as to how to keep the lineWidth an actual 2 pixels, rather than growing relative to the size of the circle?

[samid737]

var circleTween=this.game.add.tween(ping.scale).to({x: 3, y: 3}, 1000,Phaser.Easing.Linear.None, true, 0, 0);

If you tween the scale instead of the width/height, the line width will remain the same. here is a related topic with a similar effect:

 

[Drew]

Using scale seems to be causing the same issue.  It's exaggerated by the fact that I'm trying to go from a 10px circle to a 300px circle.  If I start with a bigger circle it's not so noticeable, and combining that with the alpha tween gives me the effect I'm really looking for, but I'm still curious if there's a way to do this without the line of the circle growing during the tween?

[samme]

I think you have to redraw the graphic during each tween update.