Entity velocity setting at weird angles

23 views
Skip to first unread message

dth...@gmail.com

unread,
Sep 20, 2016, 6:46:44 PM9/20/16
to melonJS - A lightweight HTML5 game engine
I am launching an attack from my entity towards the point I click at.

The vector angle is calculated by: this.angle = this.angleToPoint(new me.Vector2d(e.gameX - 30, e.gameY + 30));

The attacks are launching off towards the top left of the map (this is a top-down 2D rpg with gravity turned off), even though I am clicking towards the bottom right.

You can see here, I'm console.logging the vectors after applying appropriate trigonometry. The first click is towards the bottom right, then towards the top left, then 2 more towards the bottom right. The angles and calculations are changing as expected, but the trajectory of the attack is still heading towards the top left:

http://i.imgur.com/skIEoNv.png

A Github GIST:

https://gist.github.com/dtturcotte/9a26e996da623a13dfc7a97cf52be1a7

Why is this?

Jay Oster

unread,
Sep 20, 2016, 7:55:43 PM9/20/16
to mel...@googlegroups.com
The angleToPoint method uses Math.atan2() under the hood, which you can read from the documentation:

The Math.atan2() method returns a numeric value between -π and π representing the angle theta of an (x, y) point. This is the counterclockwise angle, measured in radians, between the positive X axis, and the point (x, y).

(Emphasis added.)

The problem is in the following code in your gist:

this.body.vel.set(Math.cos(-this.angle) * this.speedMultiplier, -Math.sin(-this.angle) * this.speedMultiplier);

You are using the inverse of the angle, which is flipping the angle direction to clockwise. Remove the negation on both sides, and that should fix it.



--
You received this message because you are subscribed to the Google Groups "melonJS - A lightweight HTML5 game engine" group.
To unsubscribe from this group and stop receiving emails from it, send an email to melonjs+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

dth...@gmail.com

unread,
Sep 20, 2016, 8:09:44 PM9/20/16
to melonJS - A lightweight HTML5 game engine
Okay. I tried `this.body.vel.set(Math.cos(this.angle) * this.speedMultiplier, -Math.sin(this.angle) * this.speedMultiplier);` and it still has the same behavior. The problem is that the projectile sporadically shoots to the exact same spot in the upper left.
> To unsubscribe from this group and stop receiving emails from it, send an email to melonjs+u...@googlegroups.com.

dth...@gmail.com

unread,
Sep 20, 2016, 8:23:43 PM9/20/16
to melonJS - A lightweight HTML5 game engine, dth...@gmail.com

dth...@gmail.com

unread,
Sep 20, 2016, 11:27:14 PM9/20/16
to melonJS - A lightweight HTML5 game engine, dth...@gmail.com
Jay any thoughts on this?

Jay Oster

unread,
Sep 21, 2016, 12:02:16 AM9/21/16
to mel...@googlegroups.com, Daniel Turcotte
What are you doing in the game.AttackEntity.update() method? That's the only piece I haven't seen.

To unsubscribe from this group and stop receiving emails from it, send an email to melonjs+unsubscribe@googlegroups.com.

dth...@gmail.com

unread,
Sep 21, 2016, 12:04:14 AM9/21/16
to melonJS - A lightweight HTML5 game engine, dth...@gmail.com

Jay Oster

unread,
Sep 21, 2016, 12:22:39 AM9/21/16
to mel...@googlegroups.com, Daniel Turcotte
It looks like you're allowing the fireball to collide with the enemy, and its collision response is pushing it away at the maximum velocity.

This line is the bug:

if ((response.a.type === 'PlayerEntity')) {

That should be if ((collidedObject.type === ... You can also use the collision mask and collision type to ignore collisions between objects. The advantage with the collision mask is that it filters out false positives like this much earlier in the collision detection broad phase.


To unsubscribe from this group and stop receiving emails from it, send an email to melonjs+unsubscribe@googlegroups.com.

dth...@gmail.com

unread,
Sep 21, 2016, 12:40:58 AM9/21/16
to melonJS - A lightweight HTML5 game engine, dth...@gmail.com
Thank you!

For collision mask, this means I can declare at object instantiation which world objects I can ignore? Thereby removing the need for all those if (collidedObject.type ===) checks?

How can I check the shape type of an entity?

Ex: how can I tell if the attack object is of type me.collision.types.ENEMY_OBJECT?

Jay Oster

unread,
Sep 21, 2016, 12:52:56 AM9/21/16
to mel...@googlegroups.com, Daniel Turcotte
The collision type needs to be set in the object constructor, along with the collision mask (the other types it is allowed to collide with)

game.AttackEntity = me.Entity.extend({
    init: function(x, y, settings) {
        this._super(me.Entity, 'init', [x, y , settings]);

        this.body.collisionType = me.collision.types.PLAYER_OBJECT;
        this.body.setCollisionMask(me.collision.types.WORLD_SHAPE | me.collision.types.ENEMY_OBJECT);

        // ...

There are some other examples in the two documentation links that I provided, but this is basically the only thing you need; set the collision type and collision mask appropriately for every entity, and the collision detection engine will filter unwanted collisions for you automatically.

For the custom collision handler (shaking the camera, removing the entity, etc.) you'll still have to check the collision type manually, but since you'll already have collisionType set appropriately, you can just check its value like this:

if (collidedObject.body.collisionType === me.collision.types.ENEMY_OBJECT)


To unsubscribe from this group and stop receiving emails from it, send an email to melonjs+unsubscribe@googlegroups.com.
Reply all
Reply to author
Forward
0 new messages