Dot product и cross product

В Paper.js векторные операции реализованы через объект Point, который представляет собой двух- или трёхмерный вектор. Основные операции с векторами включают скалярное произведение (dot product) и векторное произведение (cross product). Эти операции широко применяются для анализа направления, углов между векторами, вычисления нормалей и для физических симуляций.

Скалярное произведение (Dot Product)

Скалярное произведение двух векторов A и B определяется как:

[ A B = |A| |B| ]

где (|A|) и (|B|) — длины векторов, а () — угол между ними.

В Paper.js для вычисления скалярного произведения используется метод Point.dot():

var a = new Point(3, 4);
var b = new Point(5, 2);

var dotProduct = a.dot(b); // 3*5 + 4*2 = 15 + 8 = 23

Ключевые особенности:

  • Возвращает число (скаляр), а не вектор.
  • Используется для определения угла между векторами:
var cosTheta = a.dot(b) / (a.length * b.length);
var angle = Math.acos(cosTheta) * 180 / Math.PI;

  • Позволяет определить, направлены ли векторы в одну сторону:

    • dot > 0 — угол < 90°, векторы примерно совпадают.
    • dot = 0 — угол = 90°, векторы перпендикулярны.
    • dot < 0 — угол > 90°, векторы направлены в противоположные стороны.

Векторное произведение (Cross Product)

Векторное произведение двух векторов (A B) в трёхмерном пространстве создаёт вектор, перпендикулярный обоим:

[ A B = ]

В Paper.js, который изначально ориентирован на 2D-графику, Point.cross() возвращает скаляр, равный “модулю z-компоненты” результата векторного произведения:

var a = new Point(3, 4);
var b = new Point(5, 2);

var crossProduct = a.cross(b); // 3*2 - 4*5 = 6 - 20 = -14

Особенности 2D-кросс-продукта в Paper.js:

  • Возвращаемое значение — число, не вектор.
  • Знак числа показывает направление относительно оси Z (направление “вверх” или “вниз”).
  • Используется для вычисления ориентации точек и поворотов:
// Определение, лежат ли три точки по часовой стрелке или против
var p0 = new Point(0, 0);
var p1 = new Point(1, 0);
var p2 = new Point(1, 1);

var orientation = (p1 - p0).cross(p2 - p0);
if (orientation > 0) {
    console.log("Против часовой стрелки");
} else if (orientation < 0) {
    console.log("По часовой стрелке");
} else {
    console.log("Точки на одной линии");
}

Применение в графике и анимации

  1. Углы между векторами и нормализация Скалярное произведение удобно для проверки, когда два объекта “смотрят” друг на друга, или для подсветки направлений движения:
var v1 = new Point(1, 0);
var v2 = new Point(0.5, Math.sqrt(3)/2);

var angleDeg = Math.acos(v1.dot(v2) / (v1.length * v2.length)) * 180 / Math.PI;
  1. Определение поворота объектов Векторное произведение помогает определить направление вращения:
var direction = a.cross(b) > 0 ? "левый поворот" : "правый поворот";
  1. Физические симуляции Скалярное произведение используется для проекции силы вдоль направления движения, а кросс-продукт для вычисления момента силы (torque) в 2D.

Важные советы по работе с Paper.js

  • Методы dot() и cross() работают с объектами Point, поддерживая простую запись и цепочки операций.
  • Векторы могут быть легко нормализованы через свойство .normalize():
var unitVector = a.normalize(); // вектор длиной 1
  • Для комбинаций операций удобно создавать цепочки:
var projection = a.normalize().multiply(b.dot(a.normalize()));
  • Paper.js поддерживает сложение, вычитание, умножение на число и деление векторов, что позволяет легко комбинировать dot и cross с другими трансформациями.

Резюме по методам

Метод Возвращаемое значение Применение
Point.dot(point) число угол между векторами, проверка направления
Point.cross(point) число ориентация точек, определение поворота
Point.normalize() Point единичный вектор, подготовка к проекции
Point.length число длина вектора, масштабирование

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

Оглавление