I implemented collision detection on sprites and it works to some extent, but for some reason they seem to fall into each other. See: https://www.youtube.com/watch?v=ROer4ooFPgw
There is some jitter when it reaches the cursor, but I understand why this is happening.
The relevant code is:
Game.js
create() {
this.myGuys = this.add.group();
for (let i = 0; i < 16; i++) {
this.myGuys.add(
new Player({
x: i * PLAYER_RADIUS * 2,
y: 0,
scene: this,
})
);
}
this.physics.add.collider(this.myGuys);
}
update() {
this.myGuys.getChildren().forEach(function(enemy) {
enemy.accelerateToPointer();
}, this);
}
Player.js
class Player extends Phaser.GameObjects.Sprite {
constructor(config) {
super(config.scene, config.x, config.y, "me");
this.stopped = false;
config.scene.add.existing(this);
config.scene.physics.world.enable(this);
this.randomSpeed = 10 + Math.random() * 150;
}
setStopped(stopped) {
this.stopped = stopped;
}
accelerateToPointer() {
const pointer = this.scene.input.activePointer;
if (!pointer.x) return;
const speed = this.randomSpeed;
var angle = Math.atan2(pointer.y - this.y, pointer.x - this.x);
this.body.setVelocity(Math.cos(angle) * speed, Math.sin(angle) * speed);
}
Is this a problem with Phaser? Or am I doing something silly?