Переориентирование осей в файле three.js завершается с ошибкой при обновлении веб-страницы

Question

Я работаю над проектом, используя исходный код редактора three.js, который можно загрузить с веб-сайта three.js. В качестве части проекта мне необходимо переориентировать оси так, чтобы их можно было выровнять со стандартными координатными осями, используемыми для самолетов (ось x из носа, ось y из левого крыла, ось z вниз). Ориентацию, которую я описываю, можно увидеть при нажатии на ссылку ниже: design axis orientation

Для этого я изменил index.html (в папке редактора), three.js (в папке сборки), редактор .js (файл editor/js). После моих модификаций, подробно ниже, я могу заставить оси правильно вращаться, но когда я обновляю/перезагружаю страницу, она ломается и больше не находится в той ориентации, которая мне больше нужна. Однако, когда я нажимаю «Файл»> «Создать», он сбрасывается и точно соответствует мне. Кто-нибудь знает, почему код не работает, когда я перезагружаю страницу?

Вот изменения, которые я сделал в коде:

index.html (строка 12):

<script src="../build/three.js"></script> 

из

<script src="../build/three.min.js"></script> 

это позволяет мне использовать файл three.js вместо файла min.js

Three.js (линии 40581 и 40582):

vertices.push(- size, k, 0, size, k, 0); 
vertices.push(k, - size, 0, k, size, 0); 

из

vertices.push(- size, 0, k, size, 0, k); 
vertices.push(k, 0, - size, k, 0, size); 

это вызывает сетку для поворота на 90 градусов, от горизонтального до вертикального.

Editor.js (строка 9):

this.DEFAULT_CAMERA.position.set(-20, 20, -20); 

от

this.DEFAULT_CAMERA.position.set(20, 10, 20); 

и я также добавил линию

this.DEFAULT_CAMERA.up.set(0, 0, -1); 

непосредственно ниже функции камеры position.set ,

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

Answer 1

Много объектов в 3d.js клонировать THREE.Object3D.DefaultUp, чтобы определить их ориентацию (up vector), когда они построены.
Это значение по умолчанию используется для огней, объектов, камер и, возможно, даже больше.

В трех цветах этот вектор по умолчанию установлен в (0, 1, 0), как вы можете видеть here inside the THREE.Object3D class, что означает, что ось y направлена ​​вверх.

Объект3D.DefaultUp = new Vector3 (0, 1, 0);

Если вы хотите, чтобы ось г острием в по умолчанию, вы можете установить это значение по умолчанию до (0, 0, 1) (или, если вы хотите, чтобы указать вниз, как вы написали в своем вопросе к (0, 0, -1)).

Если вы делаете это очень рано в своем коде, поэтому, прежде чем создавать (создавать) любые объекты, все объекты по умолчанию задавали бы свойство up с самого начала, и тогда вам, вероятно, не нужно делать никаких дополнительных настраиваемая конфигурация. Вы можете изменить настройки по умолчанию с этой строки кода:

THREE.Object3D.DefaultUp.set(0, 0, 1); 

Try это, это будет сделать намного легче изменить ориентацию по умолчанию вашей three.js сцены, и я также ожидаем, что это решение, чтобы решить проблему что у вас есть, когда вы перезагружаете страницу.