세 J에서 직교 카메라를 사용할 때 객체를 선택하는 방법

Question

등각 투영 레벨이 있으며 레벨 내에서 객체를 선택하려고합니다.

나는이 하나의 Orthographic camera and selecting objects with raycast을 포함하여 몇 가지 Stackoverflow 답변을 살펴 봤지만 현재로서는 아무 것도 작동하지 않는 것 같습니다. 무언가가 꺼져 있습니다. 아마도 카메라 설정과 관련이 있기 때문에 여기에서 관련 코드를 사용하고 있습니다. 나는 내 행렬을 반복하고 타일을 추가 할 때

// set up camera 
scope.camera = new THREE.OrthographicCamera(- scope.cameraDistance * aspect, scope.cameraDistance * aspect, scope.cameraDistance, - scope.cameraDistance, - height, 1000); 
scope.camera.position.set(0 , 0 , 0); 
scope.camera.rotation.order = scope.rotationOrder; // = "YXZ" 
scope.camera.rotation.y = - Math.PI/4; 
scope.camera.rotation.x = Math.atan(- 1/Math.sqrt(2)); 

, 나는 new THREE.Object3D()에 그들 모두를 추가 한 다음 장면에 해당 개체를 추가합니다. 내 onMouseMove 이벤트는 다음과 같이 표시됩니다.

onMouseMove:function(event) { 
    event.preventDefault(); 

    var scope = Game.GSThree, 
     $container = $(scope.container.element), 
     width = $container.width(), 
     height = $container.height(), 
     vector, 
     ray, 
     intersects; 

    scope.mouse.x = (event.clientX/width) * 2 - 1; 
    scope.mouse.y = - (event.clientY/height) * 2 + 1; 

    vector = new THREE.Vector3(scope.mouse.x , scope.mouse.y , 0.5); 
    ray = scope.projector.pickingRay(vector , scope.camera); 
    intersects = ray.intersectObjects(scope.tiles.children); 

    if(intersects.length) { 
     console.log(intersects[0]); 
    } 
} 

이제는 문제가되는 것이 있습니다. 광선은 그것이 가까이에 있지 않고 한 번에 tiles의 여러 어린이들과 교차하는 것처럼 보일 때 사물과 교차합니다. intersects.length를 기록하면 때때로 3, 2 또는 1 개의 객체를 반환합니다. 다만 그것이 관련된 경우에; 각 물체 메쉬에 대한 자료는 이고 배열은입니다.

아이디어가 있으십니까?

Answer 1

항상 멍청한 것입니다. 내 컨테이너 요소에 padding-left:250px;이 있습니다. 그것을 제거하고 작동합니다. 항상 오프셋을 수정하십시오!