schmevie15

Rotation along with physics

Recommended Posts

Hello Everybody, 

I am having some trouble and am hoping one of you could help me. So essential I have a player which is a sprite rotating around a circle and I want that player to be able to collide with thing flying at it. The problem is that to get the player to rotate around the circle I have used player.anchor.setTo(center of circle), so what happened is that the physics body is now moved to said location. Is there a clean way of implementing this, perhaps a way to rotate about a fixed point without moving the physics body. I am completely confused and running out of ideas. 

post-7361-0-36821100-1398321783.png

So you guys can get an idea.

Hope y'all can help!

Thanks a ton,

Evie!

Share this post


Link to post
Share on other sites

Hey Evie,

 

I think I understand your problem, and I'm not sure if there is a built in system with Phaser to handle that scenario. However, you can do it manually do it with the code below. Is this what you meant?

// set the player rotation (an offset of a quarter turn since the sprite is facing up)player.rotation = rotation + Math.PI / 2;  // from the center of the canvas// set the proper coordinates for the current rotation// based on the radius + half the player's larger side (since we moved the anchor to 0.5)player.x = game.world.centerX + Math.cos( rotation ) * ( radius + player.height / 2 );player.y = game.world.centerY + Math.sin( rotation ) * ( radius + player.height / 2 ); // increment rotationrotation += rotationSpeed;

See it in Action

 

wpmf1y3.png

Share this post


Link to post
Share on other sites

Hey Jack,

Thanks a lot for the reply and yes that is exactly what I was looking for. Although when I pasted that exact code into my html file I got something a little weird. I was trying to follow your example and kept getting the same thing.  The character stays in the center and only rotates around its anchor as opposed to the circle. I have attached what I get below, any ideas as to what can be going on?

I appreciate the help, thanks!post-7361-0-69735000-1398378161.png

Share this post


Link to post
Share on other sites

Of course, sorry I didn't earlier.

<!doctype html><html>    <head>            <script src="js/phaser.min.js"></script>            <style>                body{margin:0}            </style>            <script type="text/javascript">var game = new Phaser.Game( 500, 500, Phaser.CANVAS, '', { preload: preload, create: create, update: update, render: render } ),    radius = 100,    rotation = 0,    rotationSpeed = 0.01,    circle,    player;function preload() {  game.load.image( 'player', 'https://s3-us-west-2.amazonaws.com/s.cdpn.io/836/dude.png' );}function create() {  game.physics.startSystem( Phaser.Physics.ARCADE );  circle = new Phaser.Circle( game.world.centerX, game.world.centerY, radius * 2 );  player = game.add.sprite( game.world.centerX, game.world.centerY, 'player' );  player.anchor.set( 0.5 );    game.physics.arcade.enable( player );}function update() {  // set the player rotation (an offset of a quarter turn since the sprite is facing up)  player.rotation = rotation + Math.PI / 2;    // from the center of the canvas  // set the proper coordinates for the current rotation  // based on the radius + half the player's larger side (since we moved the anchor to 0.5)  player.x = game.world.centerX + Math.cos( rotation ) * ( radius + player.height / 2 );  player.y = game.world.centerY + Math.sin( rotation ) * ( radius + player.height / 2 );     // increment rotation  rotation += rotationSpeed;}function render() {    game.debug.body( player );  game.debug.geom( circle, 'rgba(255, 0, 0, 0.25)' ) ;}        </script>    </head>    <body>    </body></html>

and I believe it version: Phaser v2.0.0 - Canvas - WebAudio http://phaser.io

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.