3

この例をthree.jsから変更して、マウスクリックでキャラクターを制御しようとしています。まず、キャンバスをクリックすると、マウス座標が必要になり、THREE.Raycaster.intersectObjectsを使用してそれを3D空間座標に変換します。変更されたコードでは、マウスを上に向けて、次のようになります。

var vector = new THREE.Vector3((event.clientX / window.innerWidth) * 2 - 1, -(event.clientY / window.innerHeight) * 2 + 1, 0.5);
var projector = new THREE.Projector();
projector.unprojectVector(vector, camera);

var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());

var intersects = raycaster.intersectObjects(objects);

if (intersects.length > 0) {
    console.log('intersect: ' + intersects[0].point.x.toFixed(2) + ', ' + intersects[0].point.y.toFixed(2) + ', ' + intersects[0].point.z.toFixed(2) + ')');
}
else {
    console.log('no intersect');
}

objectsグラウンドメッシュを配列に追加しましたが、グラウンドメッシュraycaster.intersectObjectsをクリックすると空の配列が返されます。scene.childrenの代わりにパスしてみましobjectsたが、運が悪かったです。

これが完全に変更されたソースです。

4

1 に答える 1

2

どうやら、ジャイロスコープが問題です。これらの線を取り除くと、交差点が機能します。これがバグなのか機能なのかわからない。

var gyro = new THREE.Gyroscope();
gyro.add( camera );
characters[ Math.floor( nSkins/2 ) ].root.add( gyro );
于 2013-03-25T02:28:08.290 に答える