броуновское движение частиц с направлениями - PullRequest
9 голосов
/ 07 марта 2012

Я пытаюсь использовать броуновское движение для создания группы случайных движущихся частиц. http://jsfiddle.net/J75Em/16/

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

Я пытался использовать изменение по осям x и y для вычисления вращения, используя atan, вы можете увидеть это, раскомментировав вращение, но это не очень хорошо работает.

Это правильный подход для этого типа движения? спасибо;

1 Ответ

8 голосов
/ 07 марта 2012

Это довольно аккуратно!

Вы делаете правильный путь, но на самом деле вы должны использовать функцию atan2. Это устраняет необходимость любых 0 проверок.

Функция atan2 дает вам угол, который против часовой стрелки от положительного вектора x

(1, 0) --->

Пчелы находятся на 90 градусов от этого начального угла, поэтому вы должны вычесть 90 градусов от направления. (в зависимости от того, в какую сторону вы выполняете вычисления dy и dx, вам может потребоваться добавить)

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

Я бы на самом деле пошел на это, сгенерировав угол между, скажем, -pi / 8 и pi / 8 радиан и случайную длину. По сути, используя полярные координаты. Затем добавьте это новое случайное полярное смещение в положение x и y, например

newX = currentX + (randomLength * cos(randomAngle + currentAngle)) and 
newY = currentY + (randomLength * sin(randomAngle + currentAngle))

Если вы работаете с углами, вы также можете получить более естественные эффекты, например, если вы хотите, чтобы пчелы оставались в определенной области, вы можете принудительно смещаться к центру области, когда они приближаются к краю. 1016 *

Обновление:

Так что я посмотрел поближе. Проблема в том, что вы ожидаете .rotate установить вращение, когда оно на самом деле добавляет к вращению

Есть 2 варианта исправления.

  1. Поворот на разницу между предыдущим и текущим углом

  2. Установить вращение, используя метод .transform

Вы можете увидеть решение 2 в действии здесь http://jsfiddle.net/c5A2A/

...