Родительская копия THREE.js не работает

У меня есть ошибка, когда я копирую Quaternionодин объект и передаю его функции, где он применяется к другому объекту, чтобы синхронизировать их вращения. Я не могу заставить приложение Quaternionприменить второй объект.

При заданном объекте 1 есть mshи объект 2 msh2, этот код не будет применять поворот mshнаmsh2

  var rot = new THREE.Quaternion().copy(msh.rotation);
  msh2.rotation.copy(rot);

Вы можете увидеть это далее в этом фрагменте Stack Snippet, который содержит проблему с наименьшим воспроизводимым образом (но это не точный код, с которым я работаю в моем реальном проекте)

var renderer = new THREE.WebGLRenderer({canvas : $("#can")[0]});
renderer.setSize($("#can").width(), $("#can").height());
var cam = new THREE.PerspectiveCamera(45, $("#can").width() / $("#can").height(), 0.1, 100);
cam.position.set(0,2,6);
cam.quaternion.multiply(new THREE.Quaternion().setFromAxisAngle( new THREE.Vector3( 1, 0, 0 ), -Math.PI/8 ));
var scene = new THREE.Scene();

var geo = new THREE.BoxGeometry(1,1,1);
var mat = new THREE.MeshBasicMaterial({color : 0xff0000});
var msh = new THREE.Mesh(geo,mat);
scene.add(msh);

geo = new THREE.BoxGeometry(1,2,1);
mat = new THREE.MeshBasicMaterial({color : 0xff00ff});
var msh2 = new THREE.Mesh(geo,mat);
msh2.position.set(2,0,0);
scene.add(msh2);

function render() {
  requestAnimationFrame( render );
  msh.rotateX(0.001);
  msh.rotateY(0.002);
  //For some reason, this doesn't work??
  var rot = new THREE.Quaternion().copy(msh.rotation);
  msh2.rotation.copy(rot);
  //Yet this does (but it doesn't fit the flow of my
  //original project because I don't want to pass
  //objects around.
  //msh2.rotation.copy(msh.rotation);
  renderer.render( scene, cam );
}
render();
<script src="https://cdn.rawgit.com/mrdoob/three.js/dev/build/three.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<canvas id="can" width="400" height="300"></canvas>

Также см. JSFiddle здесь

Я что-то упустил? Я делаю это Vector3все время, поэтому не понимаю, почему я не могу сделать это здесь ...

javascript,three.js,quaternions,

2

Ответов: 2

2 принят

msh.rotation - это экземпляр THREE.Euler, но вы пытаетесь скопировать в / из THREE.Quaternion. msh2.rotation.copy (msh.rotation) должен работать нормально, как и msh2.quaternion.copy (msh.quaternion)

0

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

  msh2.rotateX(0.001);
  msh2.rotateY(0.002);

Обновлен JSFiddle

JavaScript, Three.js, кватернионы,
Похожие вопросы
Яндекс.Метрика