Манипуляция с Entity

В этом уроке мы покажем вам, как изменить положение, ориентацию и масштаб Entity.

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

Entity - это особая форма узла графа, они наследуют много своего поведения от pc.GraphNode. Все манипуляции, которые мы применяем ниже, также могут быть применены к узлам графа.

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

Локальные и мировые координаты

Важной частью понимания того, как перемещать и манипулировать Entity, является понимание локальных и мировых систем координат. Мировая система координат используется всеми Entity, у нее есть фиксированное начало координат (0,0,0) и фиксированная ориентация - где (0,1,0) вверх. Локальная система координат относительно самого Entity. Таким образом, локальное начало координат - это положение Entity, а ориентация следует за ориентацией Entity.

Мировые и локальные системы координат

Иерархия

Важной частью системы Entity, которую нужно понять, является граф Entity или иерархия. Поскольку Entity являются типом узла графа, они собираются вместе в графе или иерархии родителей и детей. У каждого Entity может быть один родитель и несколько детей. Дочерние Entity наследуют информацию о преобразовании от своих родителей. Мировая матрица преобразования Entity получается путем умножения локального преобразования на мировое преобразование родительского Entity. Так, например, если у дочернего Entity локальный перевод составляет (1,0,0), а у его родителя локальный перевод составляет (0,1,0), мировое положение дочернего элемента будет (1,1,0)

Позиция

Получение позиции Entity просто

// Получить позицию объекта относительно системы координат родительского объекта
var lp = entity.getLocalPosition();

// Получить позицию объекта в мировом пространстве
var wp = entity.getPosition();

Эти методы оба возвращают pc.Vec3 (векторное значение в форме массива [x, y, z]).

Установка позиции объекта (Entity) также проста.

// Установить позицию объекта относительно системы координат родительского объекта
entity.setLocalPosition(x, y, z);

// Установить позицию объекта в мировом пространстве
entity.setPosition(x, y, z);

Перемещение объекта

Чтобы переместить объект Entity, вы можете добавить к позиции объекта или использовать вспомогательные функции translate и translateLocal.

// Переместить объект на 1 единицу вниз по положительной оси x мирового пространства
entity.translate(1, 0, 0);

// Переместить объект на 1 единицу вниз по локальной оси z объекта
entity.translateLocal(0, 0, 1);

Ориентация

Для установки ориентации Entity вы можете установить абсолютное вращение или применить инкрементное вращение.

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

Углы Эйлера

• Углы Эйлера - это три вращения в градусах вокруг осей X, Y и Z системы координат в указанном порядке.
• Если смотреть вдоль оси системы координат, положительный угол Эйлера приведет к противочасовому вращению вокруг этой оси.
• Углы Эйлера легко понять, потому что вы можете визуализировать их эффект в своей голове.

Кватернионы

• Кватернионы хранятся как 4 числа и представляют любую ориентацию в 3D-пространстве.
• Их сложно установить напрямую, но их можно установить из углов Эйлера, матриц вращения или представления оси-угла.
• Хотя их сложно визуализировать, они полезны, так как являются надежными и могут быть быстро интерполированы (при анимации вращения).

При написании скриптов для сущностей, скорее всего, вы будете устанавливать вращение Entity с использованием углов Эйлера. Например:

// Повернуть на 30 градусов против часовой стрелки вокруг оси x системы координат родительской сущности
// затем на 45 градусов вокруг оси y и, наконец, на 60 градусов вокруг оси z
entity.setLocalEulerAngles(30, 45, 60);

// Повернуть на 30 градусов против часовой стрелки вокруг оси x мирового пространства, затем на 45 градусов
// вокруг оси y мирового пространства и, наконец, на 60 градусов вокруг оси z мирового пространства
entity.setEulerAngles(30, 45, 60);

Однако, если вы хотите задать вращение Entity в форме кватерниона, вы можете использовать следующие функции:

// Создать идентичное вращение
var q = new pc.Quat();
// Установить для объекта Entity такое же вращение, как у его родителя - эквивалентно
// entity.setLocalEulerAngles(0, 0, 0)
entity.setLocalRotation(q);

// Установить для объекта Entity отсутствие вращения относительно мировой системы координат
// эквивалентно entity.setEulerAngles(0, 0, 0)
entity.setRotation(q);

Чтобы инкрементно повернуть Entity, вы можете использовать функцию rotate для поворота Entity относительно осей мирового пространства или rotateLocal для поворота относительно текущих осей Entity.

Например, чтобы повернуть Entity на 180 градусов вокруг оси мирового пространства вверх:

entity.rotate(0, 180, 0);

Или чтобы повернуть Entity на 90 градусов вокруг его локальной оси x, сделайте следующее:

entity.rotateLocal(90, 0, 0);

Масштабирование

Чтобы масштабировать Entity, вам просто нужно вызвать следующую функцию:

// Масштабировать объект в 2 раза по локальной оси Y
entity.setLocalScale(1, 2, 1);

И вот немного более интересный пример:

// Масштабирование объекта с использованием синусоидальной функции со временем
this.timer += deltaTime;
var s = Math.sin(this.timer) + 1;
entity.setLocalScale(s, s, s);

Обратите внимание, что в настоящее время вы не можете установить масштаб Entity в мировом пространстве.