Canvas Ball отскакивает в неправильном направлении, когда движется понг-весло

Question

Я хотел бы начать с заметки. Я попытался использовать jsfiddle, но по какой-то причине холст HTML5 не работает. Итак, в качестве обходного пути я использовал http://jsbin.com/gugihuwegopa/1/. Чтобы изменить этот сайт, нажмите кнопку «Изменить» в правом верхнем углу окна. Во всяком случае, моя проблема в том, что когда весло не двигается, мяч отскакивает правильно со всех сторон (переменная nomove не имеет к этому никакого отношения, ее просто для ее исчезновения с помощью клавиши «w»). Однако, когда я перемещаю весло мышкой по направлению к мячу, он застревает внутри весла. Я думаю, это связано с тем, что он не обновляет местоположение весла достаточно быстро, так что мяч попадает внутрь него, и мой код продолжает вызывать отскок мяча даже во время внутри. (до тех пор, пока быстро не сдвиньте весло и не отклеитесь). Да, я постарался поставить cxt.fillRect до cxt.arc(). Иногда мяч также проходит через весло. Я полагаю, что способ исправить это будет факторинга в направлении мяча в двух моих if заявлений:

if(y+ymove>=w && y+ymove<=w+h && x>=s && x<=s+l) ymove*=-1; //top and bottom 
if(x+xmove>=s && x+xmove<=s+l && y+ymove<=w+h && y+ymove>=w) xmove*=-1; //left and right 

Некоторые другие методы я пытался включать:

if(y+ymove>=w && y+ymove<=w+h && x>=s && x<=s+l && centerY+17.5 < y+ymove+5 && centerX+12.5 < x+xmove+5) ymove*=-1; //top and bottom, extra +5 for radius 
    if(x+xmove>=s && x+xmove<=s+l && y+ymove<=w+h && y+ymove>=w && centerX+12.5 < x+xmove+5 && centerY+17.5 < y+ymove+5) xmove*=-1; //left and right 

Поэтому в основном я просто нужен мяч правильно отскакивает, независимо от того, как я перемещаю весло. Не стесняйтесь редактировать все, что хотите, даже если это означает добавление более if заявлений. Все, что я прошу, абсолютно НЕ JQuery. Заранее спасибо.

Answer 1

Вы должны думать, что обработка столкновений имеет (по крайней мере) две фазы: обнаружение столкновений и разрешение столкновений. Здесь вы решаете столкновение только путем изменения скорости, но оба объекта все равно могут пересекаться, если одна скорость очень высока: один объект может быть внутри другого: так что вам также нужно решить положение, или, если вы предпочитаете «нажимать» самый большой объект из самых тяжелых. Вы можете сделать это, используя несколько минут/макс на x, y, w, h обоих объектов.

ИЛИ Есть еще один «динамический» метод, чтобы избежать перекрытия объектов: управляйте конфликтами во времени. Разделите обработку столкновений на временные подэтапы, сделав остановку при каждом столкновении. Вы должны вычислить время, когда произойдет следующее столкновение, затем переместите всех к этому времени, затем обновите только скорости и сделайте это снова, пока не пройдет достаточно времени. Таким образом, нет даже шанса на совпадение: вы «останавливаете часы» при столкновении, затем меняете скорость, а затем снова запускаете время. И несколько столкновений могут произойти в одном фрейме, случай, который не будет обрабатываться должным образом с помощью однопроходного алгоритма (случай, когда мяч ударяется около угла). Пример: скажем, время вашей игровой кадры, «dt» - 16 мс, теперь вы обнаруживаете, что мяч попадает в весло в 10,2 мс -> вы делаете оба перемещения объекта на 10,2 мс (x + = vx * 10,2/y ...) решите их скорость (только), тогда вы попросите свой механизм столкновения повторить еще 5,8 мс.
Это небольшая работа, но я сделал это в своем игровом движке, он отлично работает.

(Надеюсь, что я больше помогал, чем путаю ... :-))

Answer 2

Я бы рекомендовал сделать ваш код более удобным, чтобы получить помощь, удалить комментарии и оставить только те детали, которые вам нужно исправить.

О вашей проблеме, которую вы можете сделать, это использовать флаг, если мяч попадает в весло, установите флаг в значение «Истина», выполните перенаправление один раз и прекратите проверку на столкновение до тех пор, пока флаг не станет ложным.

Конечно, должно быть лучшее обходное решение, но это начало.