Операции с векторами

В Two.js объект Two.Vector используется для работы с двухмерными векторами. Каждый вектор имеет координаты x и y, которые могут быть заданы при создании или изменены позже.

let v1 = new Two.Vector(10, 20);
let v2 = new Two.Vector(5, 15);

Базовые операции включают сложение, вычитание, масштабирование, нормализацию и вычисление длины вектора.

  • Сложение векторов:
let result = v1.clone().add(v2);
// result.x = 15, result.y = 35
  • Вычитание векторов:
let difference = v1.clone().sub(v2);
// difference.x = 5, difference.y = 5
  • Масштабирование (умножение на число):
v1.multiplyScalar(2);
// v1.x = 20, v1.y = 40
  • Длина и нормализация вектора:
let length = v1.length();       // Вычисляет длину: sqrt(x^2 + y^2)
v1.normalize();                 // Преобразует вектор к единичной длине
  • Клонирование и копирование:
let copy = v1.clone();
let target = new Two.Vector();
target.copy(v1);

Операции со скалярами и другими векторами

  • Скалярное произведение (dot product):
let dot = v1.dot(v2);
// dot = v1.x * v2.x + v1.y * v2.y

Скалярное произведение позволяет определять угол между векторами:

let angle = Math.acos(v1.dot(v2) / (v1.length() * v2.length()));
  • Векторное произведение в 2D часто используется для определения направления поворота:
let cross = v1.cross(v2); 
// cross = v1.x * v2.y - v1.y * v2.x

Манипуляции с координатами

Вектора в Two.js можно сдвигать, поворотать и масштабировать относительно точки:

  • Сдвиг:
v1.addSelf(new Two.Vector(5, -5));
// v1.x += 5, v1.y -= 5
  • Поворот на угол θ:
v1.rotate(Math.PI / 4); // Поворот на 45 градусов
  • Масштабирование относительно другой точки:
let origin = new Two.Vector(0, 0);
v1.multiplyScalar(2, origin); // Масштабирование относительно точки (0,0)

Применение векторов к объектам Two.js

Векторы тесно связаны с позиционированием фигур и их движением:

let two = new Two({ width: 400, height: 400 }).appendTo(document.body);
let circle = two.makeCircle(100, 100, 50);

let velocity = new Two.Vector(2, 3);
function animate() {
    circle.translation.addSelf(velocity);
    two.update();
    requestAnimationFrame(animate);
}
animate();

Здесь circle.translation — это объект Two.Vector, который задает позицию фигуры на холсте. Сложение векторов обеспечивает плавное перемещение фигуры.

Геометрические операции

  • Расстояние между векторами:
let distance = v1.distanceTo(v2); 
// sqrt((v1.x - v2.x)^2 + (v1.y - v2.y)^2)
  • Интерполяция (lerp):
let v = v1.clone().lerp(v2, 0.5);
// v — точка посередине между v1 и v2
  • Ограничение длины вектора (clamp):
v1.clampScalar(0, 10); 
// Ограничивает длину вектора между 0 и 10

Полезные свойства и методы

  • x, y — координаты вектора.
  • length() — длина вектора.
  • normalize() — переводит вектор к единичной длине.
  • dot(v) — скалярное произведение с другим вектором.
  • cross(v) — псевдоскалярное произведение (в 2D).
  • angle() — угол вектора относительно оси X.
  • lerp(v, t) — линейная интерполяция между векторами.

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

Взаимодействие с массивами и объектами

Векторы можно создавать и преобразовывать из массивов и объектов:

let arr = [10, 20];
let vecFromArray = new Two.Vector().fromArray(arr);

let obj = { x: 5, y: 15 };
let vecFromObj = new Two.Vector().fromObject(obj);

Также можно преобразовать вектор обратно в массив или объект:

let array = v1.toArray(); // [x, y]
let object = v1.toObject(); // { x: x, y: y }

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

Оглавление