1 decade ago
by kyuN
I am making a simple 2D platformer game in which the player has a gun with which she can aim towards the direction dictated by the mouse, firing a bullet once the mouse is clicked. So the aiming will be fully rotational, following the movements of the mouse. So far I have gotten no result and decided to ask for help here.
1 decade ago
by Joncom
This may help.
move_toward_coord: function(x, y) {
var distance_x = x - this.pos.x - this.size.x / 2;
var distance_y = y - this.pos.y - this.size.y / 2;
var speed = 30;
this.vel.x = (distance_x > 1 ? 1 : -1) * speed * (Math.abs(distance_x) / (Math.abs(distance_x) + Math.abs(distance_y)));
this.vel.y = (distance_y > 1 ? 1 : -1) * speed * (Math.abs(distance_y) / (Math.abs(distance_x) + Math.abs(distance_y)));
}
You&
039;re going to want to call #move_to_coord
in your bullet entity
update
function.
x
and
y
will be the mouse coordinates. But it's a little trickier if you've loaded a level that doesn't all fit on the screen at once.
Something like this should do it though:
var x = ig.input.mouse.x + ig.game.screen.x;
var y = ig.input.mouse.y + ig.game.screen.y;
I have been doing it like this:
var mX = ig.input.mouse.x + ig.game.screen.x,
mY = ig.input.mouse.y + ig.game.screen.y,
centerX = player.pos.x + this.size.x/2,
centerY = player.pos.y + this.size.y/2,
angleToMouse = Math.atan2(mY - centerY, mX - centerX),
initialVelocity = 100;
// then spawn the projectile and set
projectile.vel.x = Math.cos(angleToMouse) * initialVelocity;
projectile.vel.y = Math.sin(angleToMouse) * initialVelocity;
Joncom would your way be more performant? is it just as accurate?
1 decade ago
by Joncom
@unstoppableCarl: They appear to be equally accurate. Would be interesting to do a test to find out which one performs quicker. I suspect yours does.
1 decade ago
by Joncom
@unstoppableCarl: It appears that, yes, my method is
more performant.
Code to check which is faster:
startTimer = function() {
var start = new Date().getTime();
return start;
};
stopTimer = function(start) {
var end = new Date().getTime();
var time = end - start;
return time;
};
functionA = function(x, y, velocity) {
var distance_x = x + 0; // replaced this.pos.x + this.size.x/2 with zero
var distance_y = y + 0; // replaced this.pos.x + this.size.x/2 with zero
var velocityX = (distance_x > 1 ? 1 : -1) * velocity * (Math.abs(distance_x) / (Math.abs(distance_x) + Math.abs(distance_y)));
var velocityY = (distance_y > 1 ? 1 : -1) * velocity * (Math.abs(distance_y) / (Math.abs(distance_x) + Math.abs(distance_y)));
return {
x: velocityX,
y: velocityY
};
};
functionB = function(x, y, velocity) {
var centerX = 0; // replaced this.pos.x + this.size.x/2 with zero
var centerY = 0; // replaced this.pos.x + this.size.x/2 with zero
var angleToTarget = Math.atan2(y - centerY, x - centerX);
var velocityX = Math.cos(angleToTarget) * velocity;
var velocityY = Math.sin(angleToTarget) * velocity;
return {
x: velocityX,
y: velocityY
};
};
var total_time_a = 0;
var total_time_b = 0;
var start, end, time, x, y, velocity, result;
for (var i = 0; i < 1000000; i++) {
// Generate random x, y, and velocity values.
x = Math.floor(Math.random() * 100000);
y = Math.floor(Math.random() * 100000);
velocity = Math.floor(Math.random() * 100000);
// Time method A.
start = startTimer();
result = functionA(x, y, velocity);
time = stopTimer(start);
total_time_a += time;
// Time method B.
start = startTimer();
result = functionB(x, y, velocity);
time = stopTimer(start);
total_time_b += time;
}
var winner = (total_time_a < total_time_b ? 'Method A' : 'Method B');
var speed_factor = Math.max(total_time_a, total_time_b) / Math.min(total_time_b, total_time_a);
var text = 'Winner: ' + winner + "\n" + 'It was ' + speed_factor.toFixed(2) + ' times faster.';
document.write('DONE! ');
document.write(text);
Page 1 of 1
« first
« previous
next ›
last »