THREE.jsローテーションコピーが動作しません

Question

私は1つのオブジェクトのQuaternionをコピーし、別のオブジェクトに適用して回転を同期させる機能に渡すバグがあります。私はQuaternionを2番目のオブジェクトに適用することはできません。オブジェクト1を考えると

はmshあり、オブジェクト2は、このコードは、あなたが最小再現可能で、問題が含まれています。このスタックスニペットではこれをさらに見ることができますmsh

msh2に

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

の回転を適用しないであろう、msh2ですファッション（しかし、私は私の実際のプロジェクトにして働いている正確なコードではありません）

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>

Also see the JSFiddle here

私はここで何かが足りないのですか？私はいつもVector3でこれを行います。なぜここでそれができないのかわかりません...

Answer 1

msh.rotationはTHREE.Eulerのインスタンスですが、あなたはTHREE.Quaternionから/にコピーしようとしています。 msh2.quaternion.copy（msh.quaternion）と同様に、msh2.rotation.copy（msh.rotation）は正常に動作するはずです。

Answer 2

正しく理解すれば、両方のオブジェクトが同じ速度と角度で回転します。あなただけの2行でrender();機能を更新する必要があります。

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

Updated JSFiddle