Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 07.05.2017, 13:33
Кандидат Javascript-наук
Отправить личное сообщение для yaparoff Посмотреть профиль Найти все сообщения от yaparoff
 
Регистрация: 26.04.2016
Сообщений: 106

Чтобы элемент передвигался рандомно
По полю передвигается квадратик (вверх-вниз, влево-вправо)
http://plnkr.co/edit/wx0ygfaGTWHj9dSz07G0?p=preview

1) Как сделать так чтобы он передвигался рандомно?
Т.е. либо влево на 20рх, либо вправо на 20рх, либо вверх, либо вниз.
Естественно нужно чтобы он это это делал в пределах контейнера,
и передвигался постоянно
(знаю что может помочь Math.random(), но как именно его прописать?)

2) На поле есть неподвижные квадратики - это камни. На них элемент не может заходить - он должен их обходить

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

Последний раз редактировалось yaparoff, 07.05.2017 в 14:25.
Ответить с цитированием
  #2 (permalink)  
Старый 07.05.2017, 14:46
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

yaparoff,
массив надо делать, чтобы знать где можно ходить, а где какой-то обьект.много кода ... коллизии обьектов вычислять.
Ответить с цитированием
  #3 (permalink)  
Старый 07.05.2017, 15:39
Кандидат Javascript-наук
Отправить личное сообщение для yaparoff Посмотреть профиль Найти все сообщения от yaparoff
 
Регистрация: 26.04.2016
Сообщений: 106

Сообщение от рони Посмотреть сообщение
yaparoff,
массив надо делать
В сети нашел что-то и свое подставил.
Т.е. есть массив массивов list где есть 8 вариантов, куда сделать шаг,
потом это перебирается Math.random() и выбирается одно направление.

и как результат этого вставить в мой код?
var randomDirection = {
		list: [
			[0, -20],
			[20, -20],
			[20, 0],
			[20, 20],
			[0, 20],
			[-20, 20],
			[-20, 0],
			[-20, -20]
		],
		already: [],
		random: function () {
			return this.directions[Math.floor(Math.random() * this.list.length)];
		},
		get: function () {
			var direction = this.random();

			if (this.already.length >= this.list.length) {
				this.already = [];
				return direction;
			}
			if (this.already.indexOf(direction) !== -1) {
				return this.get();
			} else {
				this.already.push(direction);
				return direction;
			}
		}
	};
	
	alert(randomDirection.get());

Последний раз редактировалось yaparoff, 08.05.2017 в 06:41.
Ответить с цитированием
  #4 (permalink)  
Старый 07.05.2017, 16:51
Кандидат Javascript-наук
Отправить личное сообщение для yaparoff Посмотреть профиль Найти все сообщения от yaparoff
 
Регистрация: 26.04.2016
Сообщений: 106

Сообщение от рони Посмотреть сообщение
чтобы знать где можно ходить, а где какой-то обьект
Вот. Так вычисляем координаты камней:
var stones = document.querySelectorAll('.stone');
	var stonesCoords = [];
	for (var i = 0; i < stones.length; i++) {
		stonesCoords.push(getCoords(stones[i]));
	}
	function getCoords(element) {
		var box = element.getBoundingClientRect();

		return {
			top: box.top + pageYOffset,
			left: box.left + pageXOffset,
			right: box.right + pageXOffset,
			bottom: box.bottom + pageYOffset
		};
	}

В код добавил http://plnkr.co/edit/wx0ygfaGTWHj9dSz07G0?p=preview

Хотелось бы добавить, что элемент должен видеть только в пределах одного хода - дальше он не видит.

Последний раз редактировалось yaparoff, 07.05.2017 в 16:53.
Ответить с цитированием
  #5 (permalink)  
Старый 07.05.2017, 17:04
Кандидат Javascript-наук
Отправить личное сообщение для yaparoff Посмотреть профиль Найти все сообщения от yaparoff
 
Регистрация: 26.04.2016
Сообщений: 106

Как теперь это все воедино соединить?
Ответить с цитированием
  #6 (permalink)  
Старый 07.05.2017, 17:33
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

yaparoff,
может ну его нафиг?
Ответить с цитированием
  #7 (permalink)  
Старый 07.05.2017, 17:40
Кандидат Javascript-наук
Отправить личное сообщение для yaparoff Посмотреть профиль Найти все сообщения от yaparoff
 
Регистрация: 26.04.2016
Сообщений: 106

Сообщение от рони Посмотреть сообщение
может ну его нафиг?
Не получиться. Нужно сделать обязательно. Эта задача - не моя прихоть
Ответить с цитированием
  #8 (permalink)  
Старый 07.05.2017, 17:45
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

yaparoff, а что это? Игра?
Ответить с цитированием
  #9 (permalink)  
Старый 07.05.2017, 17:57
Кандидат Javascript-наук
Отправить личное сообщение для yaparoff Посмотреть профиль Найти все сообщения от yaparoff
 
Регистрация: 26.04.2016
Сообщений: 106

Rise,
Да. Из книги выразительный JavaScript
Автор рассказывает как делать, НО нужна своя реализация, нельзя копировать код.
Автор так объясняет, что мне не остается просто брать и копировать оттуда код. Но так нельзя. Мне код автора во многих местах не понятен.
Поэтому реализовываю по своему, чтобы каждая строчка кода мне понятна была.

В итоге примерно вот что должно получиться http://eloquentjavascript.net/code/#7.2

но объектов может быть меньше чем там

Последний раз редактировалось yaparoff, 07.05.2017 в 18:01.
Ответить с цитированием
  #10 (permalink)  
Старый 07.05.2017, 18:44
Кандидат Javascript-наук
Отправить личное сообщение для Diphenyl Oxalate Посмотреть профиль Найти все сообщения от Diphenyl Oxalate
 
Регистрация: 21.01.2017
Сообщений: 139

yaparoff, может чем поможет
Броуновское движение на js
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как узнать родительский элемент? alex_han Events/DOM/Window 6 06.12.2013 23:01
Скрыть элемент, который идет по известной ссылке PlayHard Общие вопросы Javascript 5 25.08.2013 23:27
Скрытный элемент. RAPOS Элементы интерфейса 4 20.07.2013 21:34
Взять элемент рандомно HETmozgov jQuery 12 16.01.2011 13:52
Кодировка при использовании Ajax Nichloas AJAX и COMET 9 17.09.2009 16:06