3

正投影カメラを使用しているシーンでオブジェクトを選択しようとしています。私のコード フラグメントは既に動作していますが、正確ではありません。私はすでにstackoverflowでいくつかの答えを見つけましたが、それらは非推奨であるか、まったく機能しません。ここに私のコード onMouseDown があります

function onDocumentMouseUp( event ) {
    event.preventDefault();

    mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
    mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;

    var vector = new THREE.Vector3(mouse.x, mouse.y, 0.5);
    var pos = camera.position;
    var ray = new THREE.Raycaster(pos, vector.unproject(camera).sub(camera.position).normalize());

    var intersects = ray.intersectObjects(objects);

    if (intersects.length > 0) {
        console.log("touched:" + intersects[0]);
    }
    else {
        console.log("not touched");
    }
}

http://jsfiddle.net/ujzpe07t/1/をご覧ください

立方体の左/右/上/下で数ピクセル離れた場所をクリックしても、オブジェクトが触れられたことがわかります。

three.js r69を使用しています。

どんなヒントでも大歓迎です。ありがとう、乾杯！

4

1 に答える 1

9

正投影カメラまたは透視カメラでレイキャスティング (ピッキング) するときに使用するパターンを次に示します。

var raycaster = new THREE.Raycaster(); // create once
var mouse = new THREE.Vector2(); // create once

...

mouse.x = ( event.clientX / renderer.domElement.clientWidth ) * 2 - 1;
mouse.y = - ( event.clientY / renderer.domElement.clientHeight ) * 2 + 1;

raycaster.setFromCamera( mouse, camera );

var intersects = raycaster.intersectObjects( objects, recursiveFlag );

three.js r.84

于 2014-10-30T14:57:24.887 に答える