# Workaround for Rotation on Arcade Physics

**URL:** <https://phaser.discourse.group/t/workaround-for-rotation-on-arcade-physics/5763>\
**Category:** Phaser 3\
**Created:** [April 4, 2020, 11:57am UTC](https://phaser.discourse.group/t/workaround-for-rotation-on-arcade-physics/5763 "2020-04-04T11:57:29Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![UltimateProGrammer](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/ultimateprogrammer/32/3069_2.png) [@UltimateProGrammer](https://phaser.discourse.group/u/UltimateProGrammer)\
**Post date:** [April 4, 2020, 11:57am UTC](https://phaser.discourse.group/t/workaround-for-rotation-on-arcade-physics/5763/1 "2020-04-04T11:57:29Z")

</div>

Hello,  
I am aking a dungeon crawler. I’m trying to create a sword which rotates to face the mouse cursor. However, since rotation doesn’t work on arcade physics, it doesn’t work. Does anybody have any ideas?  
This is for a game jam, so I only want to use matter if I really have to.  
Thanks.

---

<div class="post-metadata">

**Author:** ![BlunT76](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/blunt76/32/1454_2.png) [@BlunT76](https://phaser.discourse.group/u/BlunT76)\
**Post date:** [April 4, 2020, 12:03pm UTC](https://phaser.discourse.group/t/workaround-for-rotation-on-arcade-physics/5763/2 "2020-04-04T12:03:58Z")

</div>

Hi,  
The arcade body doesn’t rotate but the sprite can. But you’ll need to find a way to handle collisions.

---

<div class="post-metadata">

**Author:** ![Telinc1](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/telinc1/32/60_2.png) [@Telinc1](https://phaser.discourse.group/u/Telinc1)\
**Post date:** [April 4, 2020, 12:15pm UTC](https://phaser.discourse.group/t/workaround-for-rotation-on-arcade-physics/5763/3 "2020-04-04T12:15:52Z")

</div>

[Colliders can take a `processCallback`](https://photonstorm.github.io/phaser3-docs/Phaser.Physics.Arcade.Factory.html#collider) which can be used to perform additional processing on the collision. In this callback, you can use any collision algorithm or a library like [SAT.js](https://github.com/jriecken/sat-js) to check for collision between arbitrary polygons. In order to ensure that the collision works properly, you might also have to adjust the body’s size to match the bounds of the rotated rectangle.

If you’ve only got a few instances where rotated objects are necessary, you don’t even need to go through the physics engine. You can perform the overlap test (either with a custom algorithm or a dedicated library) yourself.

For more complicated setups, it will likely be easier to use a more advanced physics engine.

---

<div class="post-metadata">

**Author:** ![UltimateProGrammer](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/ultimateprogrammer/32/3069_2.png) [@UltimateProGrammer](https://phaser.discourse.group/u/UltimateProGrammer)\
**Post date:** [April 4, 2020, 12:21pm UTC](https://phaser.discourse.group/t/workaround-for-rotation-on-arcade-physics/5763/4 "2020-04-04T12:21:17Z")

</div>

I’m not sure what you mean by this, sorry. (I am pretty new to phaser) I thought process callback only invoked when the two objects were touching?  
To be more clear, I’ll attach an image of what it looks like. Can you provide some psudocode?

 ![Screen Shot 2020-04-04 at 8.20.57 AM](https://global.discourse-cdn.com/free1/uploads/phaser1/original/2X/e/e79039f927b0207ec040da5c44c2c328a897381b.png)

---

<div class="post-metadata">

**Author:** ![123survesh](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/123survesh/32/2274_2.png) [@123survesh](https://phaser.discourse.group/u/123survesh)\
**Post date:** [April 4, 2020, 2:20pm UTC](https://phaser.discourse.group/t/workaround-for-rotation-on-arcade-physics/5763/5 "2020-04-04T14:20:11Z")

</div>

@UltimateProGrammer I have used rotation for a game that I worked on, it worked well for me.

There are a couple of options:

1. **angle**  
You can set it using either gameObject.setAngle(angle) or just gameObject.angle = angle

2. **rotation**  
Rotation does the same thing as angle but the values must be in radian. Rotation can be set the same way as angle. gameObject.setRotation(radian) or just gameObject.rotation = radian.

3. **angluarVelocity**  
If you want your object to keep on rotating you can try this.

Now the approach that I took was:

1. Create a image object  
`let image = scene.add.image();`
2. Init physics  
`scene.physics.world.enable(image)`  
`image.body.setAllowGravity(false)` // so that your image is not affected by gravity
3. rotate it using one of the above methods.  
`image.setAngle(30);`

This rotated both the image and arcade physics body as well. Try using this method and tell me if you face any problems.

---

<div class="post-metadata">

**Author:** ![UltimateProGrammer](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/ultimateprogrammer/32/3069_2.png) [@UltimateProGrammer](https://phaser.discourse.group/u/UltimateProGrammer)\
**Post date:** [April 4, 2020, 2:57pm UTC](https://phaser.discourse.group/t/workaround-for-rotation-on-arcade-physics/5763/6 "2020-04-04T14:57:49Z")

</div>

That doesn’t work for me. Here is the code I tried:

```javascript
let image = this.add.image();
this.physics.world.enable(image);
image.setAngle(30);

```

All it shows is a non rotated square. I feel like your right and I’m just doing something wrong haha.

---

<div class="post-metadata">

**Author:** ![supertommy](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/supertommy/32/2548_2.png) [@supertommy](https://phaser.discourse.group/u/supertommy)\
**Post date:** [April 4, 2020, 3:21pm UTC](https://phaser.discourse.group/t/workaround-for-rotation-on-arcade-physics/5763/7 "2020-04-04T15:21:16Z")

</div>

@UltimateProGrammer one trick I’ve used for homing missiles is to use a Container and a circle physics body at the tip.

The Container is never actually rotated, the image inside the container is rotated, and then the circle physics body is part of the Container.

I have an example of that here: [https://blog.ourcade.co/posts/2020/make-homing-missile-seek-target-arcade-physics-phaser-3/](https://blog.ourcade.co/posts/2020/make-homing-missile-seek-target-arcade-physics-phaser-3/)

I think you can apply a similar strategy for your sword and if you need more collision coverage along the blade you could create invisible gameobjects with a circle collider and rotate them within the Container relative to the Container’s origin.

I might actually try this out myself 😂

---

<div class="post-metadata">

**Author:** ![123survesh](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/123survesh/32/2274_2.png) [@123survesh](https://phaser.discourse.group/u/123survesh)\
**Post date:** [April 4, 2020, 4:18pm UTC](https://phaser.discourse.group/t/workaround-for-rotation-on-arcade-physics/5763/8 "2020-04-04T16:18:11Z")

</div>

@UltimateProGrammer You are not doing anything wrong, I was wrong. I just checked my game as well. The physics boundaries of my game objects have not rotated either. Sorry for the misleading info.

I checked the docs and found that only game objects rotate and not their Physics boundaries.

> #### rotation :number
> 
> This body’s rotation, in degrees, based on its angular acceleration and angular velocity. The Body’s rotation controls the `angle` of its Game Object. **It doesn’t rotate the Body’s boundary, which is always an axis-aligned rectangle or a circle.**

[https://photonstorm.github.io/phaser3-docs/Phaser.Physics.Arcade.Body.html#rotation\_\_anchor](https://photonstorm.github.io/phaser3-docs/Phaser.Physics.Arcade.Body.html#rotation__anchor)

---

<div class="post-metadata">

**Author:** ![samme](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/samme/32/5275_2.png) [@samme](https://phaser.discourse.group/u/samme)\
**Post date:** [April 4, 2020, 6:23pm UTC](https://phaser.discourse.group/t/workaround-for-rotation-on-arcade-physics/5763/9 "2020-04-04T18:23:44Z")

</div>

https://codepen.io/samme/embed/preview/zYGwNqp?height=300&slug-hash=zYGwNqp&default-tabs=js,result&host=https://codepen.io

---

<div class="post-metadata">

**Author:** ![supertommy](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/supertommy/32/2548_2.png) [@supertommy](https://phaser.discourse.group/u/supertommy)\
**Post date:** [April 5, 2020, 3:53pm UTC](https://phaser.discourse.group/t/workaround-for-rotation-on-arcade-physics/5763/10 "2020-04-05T15:53:05Z")

</div>

I gave my idea a try and it can work. @samme example is good too

Here’s a video of me figuring it out: [https://youtu.be/akgFNu60Kv4](https://youtu.be/akgFNu60Kv4)

I put the source on Github as well: [https://github.com/ourcade/phaser3-sword-rotation-arcade-physics](https://github.com/ourcade/phaser3-sword-rotation-arcade-physics)

And this is the working demo: [https://ourcade.github.io/phaser3-sword-rotation-arcade-physics/](https://ourcade.github.io/phaser3-sword-rotation-arcade-physics/)

---

<div class="post-metadata">

**Author:** ![UltimateProGrammer](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/ultimateprogrammer/32/3069_2.png) [@UltimateProGrammer](https://phaser.discourse.group/u/UltimateProGrammer)\
**Post date:** [April 5, 2020, 10:04pm UTC](https://phaser.discourse.group/t/workaround-for-rotation-on-arcade-physics/5763/11 "2020-04-05T22:04:48Z")

</div>

The jam was do today and I ended up just using a bow and arrow, but I am marking this as solved because that is exactly what I asked the question for. I’m really looking forward to implementing this solution in the other (actual) game I’m working on!
