Phaser pivot doesn't work

[jdnichollsc]

Hi guys,

 

See my demo about this issue: http://phaser.azurewebsites.net/runner2/

 

Set the pivot to rotate the sprite doesn't work

 

Regards, Nicholls 

[Skeptron]

Could you be more precise about the issue? Because when I play your game and my character dies, it does rotate a lot.

[rich]

Here's an example showing how it works: http://phaser.io/sandbox/EuEELCrM/play

 

Code is below

var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render });function preload() {    game.load.image('arrow', 'assets/sprites/arrow.png');}var arrow1;var arrow2;var arrow3;var arrow4;function create() {    game.stage.backgroundColor = '#3e5f96';    arrow1 = game.add.sprite(200, 150, 'arrow');    arrow1.pivot.x = 100;    arrow2 = game.add.sprite(600, 150, 'arrow');    arrow2.pivot.y = 100;    arrow3 = game.add.sprite(200, 450, 'arrow');    arrow3.pivot.x = 100;    arrow3.pivot.y = 100;    arrow4 = game.add.sprite(600, 450, 'arrow');    arrow4.pivot.x = 100;    arrow4.anchor.set(0.5);}function update() {    arrow1.rotation += 0.05;    arrow2.rotation += 0.05;    arrow3.rotation += 0.05;    arrow4.rotation += 0.05;}function render() {    game.debug.geom(new Phaser.Point(arrow1.x, arrow1.y), '#ffff00');    game.debug.geom(new Phaser.Point(arrow2.x, arrow2.y), '#ffff00');    game.debug.geom(new Phaser.Point(arrow3.x, arrow3.y), '#ffff00');    game.debug.geom(new Phaser.Point(arrow4.x, arrow4.y), '#ffff00');}

[jdnichollsc]

 

Here's an example showing how it works: http://phaser.io/sandbox/EuEELCrM/play

 

Code is below

var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render });function preload() {    game.load.image('arrow', 'assets/sprites/arrow.png');}var arrow1;var arrow2;var arrow3;var arrow4;function create() {    game.stage.backgroundColor = '#3e5f96';    arrow1 = game.add.sprite(200, 150, 'arrow');    arrow1.pivot.x = 100;    arrow2 = game.add.sprite(600, 150, 'arrow');    arrow2.pivot.y = 100;    arrow3 = game.add.sprite(200, 450, 'arrow');    arrow3.pivot.x = 100;    arrow3.pivot.y = 100;    arrow4 = game.add.sprite(600, 450, 'arrow');    arrow4.pivot.x = 100;    arrow4.anchor.set(0.5);}function update() {    arrow1.rotation += 0.05;    arrow2.rotation += 0.05;    arrow3.rotation += 0.05;    arrow4.rotation += 0.05;}function render() {    game.debug.geom(new Phaser.Point(arrow1.x, arrow1.y), '#ffff00');    game.debug.geom(new Phaser.Point(arrow2.x, arrow2.y), '#ffff00');    game.debug.geom(new Phaser.Point(arrow3.x, arrow3.y), '#ffff00');    game.debug.geom(new Phaser.Point(arrow4.x, arrow4.y), '#ffff00');}

 

Ohh thanks Rich!

 

To rotate the sprite from the center Point with the pivot is:

arrow4 = game.add.sprite(600, 450, 'arrow');arrow4.anchor.setTo(0.5, 1);arrow4.pivot.setTo(0, -arrow4.height/2);

 

Thanks