анимация поворота дочернего элемента к лицевой камере не дает ожидаемых результатов три js

#javascript #three.js #3d #rotation

#javascript #three.js #3D #поворот

Вопрос:

У меня следующий сценарий:

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

Внутри этого родительского элемента у меня есть дочерний элемент, который всегда находится на 0,0,0 (локальные координаты). этот дочерний элемент не поворачивается относительно родительского элемента и не масштабируется.

В какой-то момент я хочу повернуть этот дочерний элемент вокруг его оси y внутри родительского элемента, чтобы его ось x была обращена к камере.

в настоящее время я делаю это следующим образом:

 let rotation = {v: 0};
const goal = Math.atan2( ( this.sceneManager.camera.position.x - this.sceneManager.carContainer.position.x ), ( this.sceneManager.camera.position.z - this.sceneManager.carContainer.position.z ) )   .5 * Math.PI;
const mapRotation = new TWEEN.Tween(rotation)
    .delay(750)
    .to({ v: goal }, 250)
    .onUpdate(() => {
        animation.model.rotation.y = rotation.v;
    });
mapRotation.start();
  

В этом случае animation.model дочерний элемент
this.sceneManager.carContainer является родительским
и this.sceneManager.camera является точкой, к которой я хочу, чтобы дочерний элемент вращался.

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

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

Если требуется дополнительная информация, контекст или код, пожалуйста, дайте мне знать!

Комментарии:

1. Мое лучшее предположение заключается в том, что вы вычисляете угол, но затем добавляете ` .5 * Математику. PI;` по какой-то причине. Если удаление этих двух значений не решит вашу проблему, не могли бы вы опубликовать рабочую демонстрацию? Возможно, через фрагмент или JSFiddle.