Three.js camera.rotation.y до 360 градусов преобразование

Я пытаюсь повернуть 2D-объект (в наложении мини-карты стиля GTA), относящийся к вращению ролика Three.js в моей 3D-сцене.Three.js camera.rotation.y до 360 градусов преобразование

Проблема заключается в том, что радианы, возвращаемые с камеры. Значение rotation.y немного странно, от 0> -1.4 радианов до первых 45 градусов, от -1.4> 0 радиан до 90 градусов, 0> 1,4 радианы до 270 градусов и 1,4> 0 радиан до 360 градусов.

Кто-нибудь знает способ конвертировать или перевести эти значения на 360 коордов?

Я использую PerspectiveCamera и OrbitControls.

Заранее благодарен!

источник

2017-02-07 David Tidman

Попробуйте установить 'camera.rotation.order =«YXZ»,' и посмотреть, если поведение является более интуитивным к вам. Он может работать от - PI до + PI, в зависимости от вашего варианта использования. – WestLangley

Спасибо @WestLangley, оказывается, все было нужно! Большое спасибо (y) –

Я отправил ответ с дальнейшим объяснением. – WestLangley

Я думаю, что это может быть связано с преобразованием из кватернионов. Не уверен, что приведен следующий пример, но он может помочь вам найти решение.

const euler = new THREE.Euler(); 
const rotation = euler.setFromQuaternion(camera.quaternion); 
const radians = rotation.z > 0 
    ? rotation.z 
    : (2 * Math.PI) + rotation.z; 
const degrees = THREE.Math.radToDeg(radians);

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

Вот codepen, который демонстрирует это поведение:

http://codepen.io/kevanstannard/pen/NdOvoO/

я использовал некоторые детали из следующего вопроса:

three.js perspectivecamera current angle in degrees

Редактировать # 1

основе ответ от @WestLangley мой ответ ab Ове не является правильным, так что просто документировать улучшение, вот некоторые код, основанный на решении Запада:

// Set Y to be the heading of the camera 
camera.rotation.order = 'YXZ';

А потом

const heading = camera.rotation.y; 
const radians = heading > 0 ? heading : (2 * Math.PI) + heading; 
const degrees = THREE.Math.radToDeg(radians);

И лучше codepen

http://codepen.io/kevanstannard/pen/YNJgXd

источник

2017-02-08 11:58:11

Спасибо за ваш ответ, но не совсем то, что мне нужно - проблема в радианских значениях, возвращаемых с камеры.rotation.y, о которой я объяснил выше, и, следовательно, не будет конвертировать в полный диапазон 0> 360 градусов, поскольку я панорамирую камера. Со значениями, которые он возвращает при повороте камеры в полном цикле (0> -140> 0> 140> 0 радианов), преобразуйте в (0> -90> 0> 90> 0 градусов), а не 0> 360 градусов , Может ли кто-нибудь помочь? –

@DavidTidman извините, я неправильно понял вопрос. Я пересмотрел ответ, надеюсь, он поможет вам решить проблему. –

спасибо !! Это работает отлично. Теперь посмотрим на кватернион и эйлеры, чтобы посмотреть, как это работает. Большое спасибо за вашу помощь! –

camera.rotation является так называемым Euler angle, так как вы также можете прочитать here in the three.js docs for THREE.Object3D (который является базовым классом для THREE.Camera класс). Вы не можете просто получить угол к определенной оси непосредственно из угла Эйлера, так как угол, который вы получаете, зависит от порядка эйлера.

источник

2017-02-09 14:41:15 Wilt

Если вы установили

camera.rotation.order = "YXZ"

(по умолчанию «XYZ») углы Эйлера будет сделать гораздо больше смысла для вас:

rotation.y будет камера движется в радианах

rotation.x будет шагом камеры в радианах

rotation.z будет рулон камеры в радианах

Ротации будут применены в этом порядке.

Для получения дополнительной информации см. this stackoverflow answer.

Three.js R.84

источник

2017-02-09 16:17:02 WestLangley

Это сработало отлично. Большое спасибо @WestLangley! –

Three.js camera.rotation.y до 360 градусов преобразование

ответ

Смежные вопросы