Я довольно новичок в Javascript и использую холст вообще, и я не могу получить обнаружение столкновения для работы с моими полотнами.Столкновения в холсте HTML5
У меня обычно есть небольшой квадрат, нарисованный на холсте, который я могу контролировать с помощью клавиш со стрелками на клавиатуре, но он будет продолжать проходить сквозь холст.
Это рабочий код без моих попыток обнаружения столкновения.
<!DOCTYPE html>
<html>
<head>
<canvas id = "gameCanvas" width="400" height="400" style = "border:1px solid #000000;"></canvas>
<style type="text/css"></style>
</head>
<body>
<script type="text/javascript">
var c = document.getElementById("gameCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle = "rgb(255, 0, 0)";
var snake = {
x: 5
, y: 5
};
function drawSnake() {
ctx.clearRect(0,0, ctx.canvas.width, ctx.canvas.height);
ctx.fillRect(snake.x ,snake.y,20,20);
}
window.addEventListener("keydown", function(event) {
if (event.keyCode == 39)
snake.x += 5;
else if (event.keyCode == 37)
snake.x -= 5;
else if (event.keyCode == 38)
snake.y -= 5;
else if (event.keyCode == 40)
snake.y += 5;
drawSnake();
});
drawSnake();
</script>
</body>
</html>
Это моя попытка обнаружения столкновения.
//Wall Collision
if(snake.x >= canvas.w || snake.x <= -1 || snake.y >= canvas.h || snake.y <= -1) {
return;
}
Ввод этого кода оставляет меня с пустым холстом, и я не понимаю, почему.
Я хочу, чтобы квадрат сбросил свое положение, когда он сталкивается с холст-стенкой, и именно там у меня все проблемы.
В каком месте был добавлен код обнаружения столкновения? –
coooooooooooooooooooollliiiiiiiiiiiiiiiiiiision: https://github.com/jriecken/sat-js –
Кроме того, ваш ''