Как повернуть 3d точку? - PullRequest
Новая
       73

Как повернуть 3d точку?

0 голосов
/ 10 июля 2019

В настоящее время я разрабатываю 3D рендерер в js.

Я бы хотел рендерить кубы - и это работает довольно хорошо - но я хотел бы сделать что-то вроде вращения каждого куба.

Итак, я получил некоторую вершину куба и хочу вращать x / y / z (тангаж, крен, рыскание) каждого куба вокруг себя.

Это функция вращения 3d: 

let rotate3d = (points = [0,0,0], pitch = 0, roll = 0, yaw = 0) => {
    let cosa = Math.cos(yaw),
        sina = Math.sin(yaw);
    let cosb = Math.cos(pitch),
        sinb = Math.sin(pitch);
    let cosc = Math.cos(roll),
        sinc = Math.sin(roll);
    let Axx = cosa*cosb,
        Axy = cosa*sinb*sinc - sina*cosc,
        Axz = cosa*sinb*cosc + sina*sinc;
    let Ayx = sina*cosb,
        Ayy = sina*sinb*sinc + cosa*cosc,
        Ayz = sina*sinb*cosc - cosa*sinc;
    let Azx = -sinb,
        Azy = cosb*sinc,
        Azz = cosb*cosc;
    let px = points[0];
    let py = points[1];
    let pz = points[2];
    points[0] = Axx*px + Axy*py + Axz*pz;
    points[1] = Ayx*px + Ayy*py + Ayz*pz;
    points[2] = Azx*px + Azy*py + Azz*pz;
    return points;
  }

и это фрагмент моей программы рендерера: 

for (let vert of cube.vertex) {
  let x = vert[0] - camera.position[0],
      y = vert[1] - camera.position[1],
      z = vert[2] - camera.position[2];

  if (cube.rotation) {
    cube.rotation += Math.PI * 0.02;
    let p = rotate(vert.slice(0), cube.r, 0, 0)
    x = p[0] - camera.position[0]
    y = p[1] - camera.position[1]
    z = p[2] - camera.position[2]
  }
  
  # ... draw polygons (cube) by converting 3d coordinates to 2d coordinates.
}

см. Рисунок 1

Итак : Если куб порожден в [0, -1, 0], программа вращает этот куб вокруг оси y (по часовой стрелке). Но изменение спавна на [1, -1, 0] позволяет кубу вращаться вокруг той же точки (начала координат), но с пробелом 1. Я хотел бы вращать куб на своем спавне!

см. Рисунок 2

Редактировать : Это процедура порождения куба: 

spawn(p) {
    this.position = p;
    const vertex = [[-1,-1,-1], [1,-1,-1], [1,1,-1], [-1,1,-1], [-1,-1,1], [1,-1,1], [1,1,1], [-1,1,1]];
    this.vertex = []
    for (let vert of vertex) {
      let position = []
      for (let i=0; i<vert.length; i++) position.push(vert[i]/2 + this.position[i])
      this.vertex.push(position)
    }
}

Итак, мой вопрос: как отредактировать функцию поворота, чтобы добавить исходную точку, в которой я бы хотел вращать куб?

1 Ответ

0 голосов
/ 10 июля 2019

Самый простой способ указать точку для поворота:

  1. Переведите (переместите) ваш объект так, чтобы точка вращения находилась в начале координат (0,0,0)
  2. Поверните нужную сумму
  3. Сделайте перевод, противоположный тому, что на шаге 1.

В (псевдо) код: 

var translationVector = originPoint.minus(rotationPoint);
myObject.translate(translationVector);
myObject.rotate(eulerX, eulerY, eulerZ);
myObject.translate(-translationVector);
...