Javascript холст движение столкновения блок события - PullRequest
1 голос
/ 19 января 2012

Чтобы определить, когда одно изображение находится в пределах диапазона другого изображения на холсте, я делаю:

if (herohitboxX <= (villageMain.x + 200) && villageMain.x <= (herohitboxX) && herohitboxY <= (villageMain.y + 200) && villageMain.y <= (herohitboxY) ) { console.log('inside bldg') }

, который прекрасно работает, но у меня возникла огромная проблема, чтобы понять, как не позволить игроку войти вздание / дерево / объект, но позволяя им по-прежнему удаляться от объекта.

Я могу заставить игрока скользить сквозь объект, перемещая его, касаясь, и блокируя его возвращение из этого 1 направления,но я не могу блокировать движение со всех 4-х сторон ....

Основная проблема в том, что он только определяет, перекрываются ли они, но не говорит вам, в каком направлении шел игрок.Простое отрицание направления движения игроков, когда они находятся внутри здания, не сработало (если они нажимают вправо и касаются объекта, идите налево, в противном случае, если они не касаются и не нажимают вправо, идите вправо).Или, если они шли вверх и касались здания, отправьте ВНИЗ.Разве это не должно сработать?

Единственное, о чем я могу подумать, - это сделать 4 тонких прямоугольника / линии, представляющих каждую сторону периметра, а затем просто не допустить движения в направлении, в котором он стоит.Но должен быть какой-то более легкий путь!Что это?

Сохранить предыдущее местоположение и сравнить ??Прямо сейчас нет направления движения, на которое можно смотреть, если в ключевом слушателе обнаруживается UP, он перемещает фоновое изображение и регулирует позицию спрайта игроков.Какие-нибудь советы?

1 Ответ

1 голос
/ 19 января 2012

Предположительно, этот код происходит во время движения или попытки игрока двигаться.

Определите центр обоих объектов.Если центр игрока пытается отойти от центра другого объекта, позвольте перемещению совершиться, даже если они пересекаются.

Если нет, остановите движение.

С другой стороны, выиметь центр игрока и центр объекта.Это делает line1.

И у вас есть команда перемещения, которая создаст потенциальное новое место для центра игрока (старое местоположение плюс некоторое направление).Вычислите это, чтобы получить строку 2.

Теперь, если вторая строка длиннее первой, это означает, что игрок отходит от пересекающегося объекта, и поэтому это должно быть разрешено.Может быть, они сталкиваются с объектом справа и хотят двигаться вверх или влево.Оба из них делают линию 2 длиннее линии 1.

Его следует блокировать только в том случае, если игрок пытается укоротить линию (двигаясь прямо к объекту).


подсказки для линий

Предположим, что центр игрока был px, py, и предположим, что центр объекта ox, oy.Тогда расстояние между ними:

var dx = px - ox;
var dy = py - oy;
var dist = Math.sqrt(dx * dx + dy * dy);

Но здесь есть что-то смешное.Нам не нужно знать расстояние, нам просто нужно сравнить его с другим расстоянием.Это означает, что мы можем пропустить (потенциально медленный) вызов Math.sqrt и сравнить квадратное расстояние line1 с квадратным расстоянием line2.Итак, вот строка 1:

var dx = px - ox;
var dy = py - oy;
var line1 = dx * dx + dy * dy;

И для строки 2 нам нужно знать, где будет игрок, если команда перемещения была успешной, мы называем это newpx, newpy.

var dx2 = newpx - ox;
var dy2 = newpy - oy;
var line2 = dx2 * dx2 + dy2 * dy2;

Так что еслиline2 > line1, разрешить движение!В противном случае заблокируйте движение от происходящего.

обратите внимание , что все это предполагает, что игрок может двигаться только в одном кардинальном направлении за раз (вверх, вниз, влево, вправо) и невверх-вправо.Если это так, вам придется быть немного более осторожным.

...