Форум программистов, компьютерный форум, киберфорум
JavaScript: HTML5 Canvas
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.75/8: Рейтинг темы: голосов - 8, средняя оценка - 4.75
0 / 0 / 0
Регистрация: 08.01.2017
Сообщений: 125

Как сделать, чтобы змейка при столкновении со стеной двигалась вдоль неё?

05.01.2020, 11:04. Показов 1658. Ответов 4
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Есть задание, сделать змейку, но когда я сделал, чтобы она не врезалась, змейка ушла далеко за пределы карты. Вопрос, как сделать, чтобы она при столкновении со стеной двигалась вдоль неё?
0
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
05.01.2020, 11:04
Ответы с готовыми решениями:

Как сделать так чтобы страничка при увеличения разрешения не двигалась в разные стороны, и как сделать чтобы при открытии в опере и в других браузерах
все обьекты на странице не двигались в разные стороны???

Как сделать чтобы, строка на панели двигалась?
<html> <head> <script language="JavaScript"> <!-- hide function statbar(txt) { window.status = txt; } //...

Как сделать, чтобы при наведении на пункт меню двигалась стрелка
Здравствуйте! Подскажите пожалуйста, как сделать такое меню, чтобы при нажатии на пункт меню двигалась стрелка и менялась картинка. ...

4
Эксперт JS
 Аватар для DrType
6553 / 3624 / 1075
Регистрация: 07.09.2019
Сообщений: 5,877
Записей в блоге: 1
05.01.2020, 12:33
Так может быть покажете, как Вы сделали?
0
0 / 0 / 0
Регистрация: 08.01.2017
Сообщений: 125
05.01.2020, 13:31  [ТС]
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
const canvas = document.getElementById("game");
const ctx = canvas.getContext("2d");
 
const ground = new Image();
ground.src = "img/ground.png";
 
const foodImg = new Image();
foodImg.src = "img/food.png";
 
let box = 32;
let score = 0;
 
let food = {
  x: Math.floor((Math.random() * 17 + 1)) * box,
  y: Math.floor((Math.random() * 15 + 3)) * box,
};
 
let snake = [];
snake[0] = {
  x: 9 * box,
  y: 10 * box
};
 
document.addEventListener("keydown", direction);
 
let dir;
 
function direction(event) {
  if(event.keyCode == 37 && dir != "right")
    dir = "left";
  else if(event.keyCode == 38 && dir != "down")
    dir = "up";
  else if(event.keyCode == 39 && dir != "left")
    dir = "right";
  else if(event.keyCode == 40 && dir != "up")
    dir = "down";
}
 
function eatTail(head, arr) {
  for(let i = 0; i < arr.length; i++) {
    if(head.x == arr[i].x && head.y == arr[i].y)
      clearInterval(game);
  }
}
 
function drawGame() {
  ctx.drawImage(ground, 0, 0);
 
  ctx.drawImage(foodImg, food.x, food.y);
 
  for(let i = 0; i < snake.length; i++) {
    ctx.fillStyle = i == 0 ? "green" : "red";
    ctx.fillRect(snake[i].x, snake[i].y, box, box);
  }
 
  ctx.fillStyle = "white";
  ctx.font = "50px Arial";
  ctx.fillText(score, box * 2.5, box * 1.7);
 
  let snakeX = snake[0].x;
  let snakeY = snake[0].y;
 
  if(snakeX == food.x && snakeY == food.y) {
    score++;
    food = {
      x: Math.floor((Math.random() * 17 + 1)) * box,
      y: Math.floor((Math.random() * 15 + 3)) * box,
    };
  } else {
    snake.pop();
  }
 
  //if(snakeX < box || snakeX > box * 17
  //|| snakeY < 3 * box || snakeY > box * 17)
  //snake left(game);
 
  if(dir == "left") snakeX -= box;
  if(dir == "right") snakeX += box;
  if(dir == "up") snakeY -= box;
  if(dir == "down") snakeY += box;
 
  let newHead = {
    x: snakeX,
    y: snakeY
  };
 
  eatTail(newHead, snake);
 
  snake.unshift(newHead);
}
 
let game = setInterval(drawGame, 100);
 
 
 
 
 
 
//
0
0 / 0 / 0
Регистрация: 08.01.2017
Сообщений: 125
07.01.2020, 08:08  [ТС]
выложил код

Добавлено через 1 минуту
DrType, выложил

Добавлено через 1 минуту
DrType,
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
const canvas = document.getElementById("game");
const ctx = canvas.getContext("2d");
 
const ground = new Image();
ground.src = "img/ground.png";
 
const foodImg = new Image();
foodImg.src = "img/food.png";
 
let box = 32;
let score = 0;
 
let food = {
  x: Math.floor((Math.random() * 17 + 1)) * box,
  y: Math.floor((Math.random() * 15 + 3)) * box,
};
 
let snake = [];
snake[0] = {
  x: 9 * box,
  y: 10 * box
};
 
document.addEventListener("keydown", direction);
 
let dir;
 
function direction(event) {
  if(event.keyCode == 37 && dir != "right")
    dir = "left";
  else if(event.keyCode == 38 && dir != "down")
    dir = "up";
  else if(event.keyCode == 39 && dir != "left")
    dir = "right";
  else if(event.keyCode == 40 && dir != "up")
    dir = "down";
}
 
function eatTail(head, arr) {
  for(let i = 0; i < arr.length; i++) {
    if(head.x == arr[i].x && head.y == arr[i].y)
      clearInterval(game);
  }
}
 
function drawGame() {
  ctx.drawImage(ground, 0, 0);
 
  ctx.drawImage(foodImg, food.x, food.y);
 
  for(let i = 0; i < snake.length; i++) {
    ctx.fillStyle = i == 0 ? "green" : "red";
    ctx.fillRect(snake[i].x, snake[i].y, box, box);
  }
 
  ctx.fillStyle = "white";
  ctx.font = "50px Arial";
  ctx.fillText(score, box * 2.5, box * 1.7);
 
  let snakeX = snake[0].x;
  let snakeY = snake[0].y;
 
  if(snakeX == food.x && snakeY == food.y) {
    score++;
    food = {
      x: Math.floor((Math.random() * 17 + 1)) * box,
      y: Math.floor((Math.random() * 15 + 3)) * box,
    };
  } else {
    snake.pop();
  }
 
  //if(snakeX < box || snakeX > box * 17
  //|| snakeY < 3 * box || snakeY > box * 17)
  //snake left(game);
 
  if(dir == "left") snakeX -= box;
  if(dir == "right") snakeX += box;
  if(dir == "up") snakeY -= box;
  if(dir == "down") snakeY += box;
 
  let newHead = {
    x: snakeX,
    y: snakeY
  };
 
  eatTail(newHead, snake);
 
  snake.unshift(newHead);
}
 
let game = setInterval(drawGame, 100);
 
 
 
 
 
 
//
0
9948 / 2948 / 497
Регистрация: 05.10.2013
Сообщений: 8,018
Записей в блоге: 242
12.01.2020, 19:50
Выложите ещё картинки, потому что, например, я сначала копирую код, запускаю его, а потом начинаю разбираться, экспериментирую и запускаю.
1
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
12.01.2020, 19:50
Помогаю со студенческими работами здесь

Как сделать, чтобы при передвижении по экрану одной формы за ней двигалась другая?
Как сделать, чтобы при передвижении по экрану одной формы за ней двигалась другая?

Как сделать так чтобы при изменении размера окна апплета в Java картинка двигалась фиксировано с окном?
как сделать так чтобы при изменении размера окна апплета в Java картинка двигалась фиксировано с окном import java.applet.Applet; ...

Сделать рисунок в турбо паскале. И нужно сделать чтобы картника двигалась при нажатии на стрелки
(Ссылка на сторонний ресурс удалена)

Как сделать чтобы фигурка двигалась?
Как сделать чтобы фигурка двигалась? .386 .model stdcall, flat option casemap:none includelib \masm32\lib\kernel32.lib ...

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


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Новые блоги и статьи
Установка Qt Creator для C и C++: ставим среду, CMake и MinGW без фреймворка Qt
8Observer8 05.04.2026
Среду разработки Qt Creator можно установить без фреймворка Qt. Есть отдельный репозиторий для этой среды: https:/ / github. com/ qt-creator/ qt-creator, где можно скачать установщик, на вкладке Releases:. . .
AkelPad-скрипты, структуры, и немного лирики..
testuser2 05.04.2026
Такая программа, как AkelPad существует уже давно, и также давно существуют скрипты под нее. Тем не менее, прога живет, периодически что-то не спеша дополняется, улучшается. Что меня в первую очередь. . .
Отображение реквизитов в документе по условию и контроль их заполнения
Maks 04.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеСпецтехники", разработанного в конфигурации КА2. Данный документ берёт данные из другого нетипового документа. . .
Фото всей Земли с борта корабля Orion миссии Artemis II
kumehtar 04.04.2026
Это первое подобное фото сделанное человеком за 50 лет. Снимок называют новым вариантом легендарной фотографии «The Blue Marble» 1972 года, сделанной с борта корабля «Аполлон-17». Новое фото. . .
Вывод диалогового окна перед закрытием, если документ не проведён
Maks 04.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: реализовать программный контроль на предмет проведения документа. . .
Программный контроль заполнения реквизитов табличной части документа
Maks 02.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: 1. Реализовать контроль заполнения реквизита. . .
wmic не является внутренней или внешней командой
Maks 02.04.2026
Решение: DISM / Online / Add-Capability / CapabilityName:WMIC~~~~ Отсюда: https:/ / winitpro. ru/ index. php/ 2025/ 02/ 14/ komanda-wmic-ne-naydena/
Программная установка даты и запрет ее изменения
Maks 02.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: при создании документов установить период списания автоматически. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru