three.js - THREE.Raycaster は CSS3DObject オブジェクトの交差チェックを実行しますか?

Question

マウス座標からレイキャストを実行し、3 つの CSS3DObject オブジェクトのグループの交差をチェックする必要があります。

関数は次のとおりです。

RayCastCheck = function(event, objects){
    var vector = new THREE.Vector3((event.clientX / window.innerWidth)*2 - 1, -(event.clientX / window.innerHeight )*2 + 1, 0.5);
    new THREE.Projector().unprojectVector( vector, camera);
    var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());
    var intersects = raycaster.intersectObjects(objects);
    console.log(intersects.length);
};

---

objects 引数は の配列ですcss3dobjects。同様の関数を使用して、シーン上のドロップを正しいマウス位置に向けることができるので、ワールド空間でのマウス ポイントの計算は正しいと思います。これにより、Raycaster は の交差をチェックしないと考えるようになりましたcss3dobjects。

私の css3dobjects は通常、その要素として div を使用して構築されます。

createObject = function(){
  var element = document.createElement("div");    
  var obj = new THREE.CSS3DObject(element);
  scene.add(obj);
}

私のシーンはこの関数を介して作成されます

//global
var scene;
var camera;
var renderer;

createScene = function(){
    camera = new THREE.PerspectiveCamera( 75, 400 / 600, 1, 1000 );
    camera.position.z = 500;
    scene = new THREE.Scene();
    renderer = new THREE.CSS3DRenderer();
    renderer.setSize(400, 600);
$(#body).appendChild(renderer.domElement);
}

レイキャスティングを有効にするために必要なすべての要素がシーンに含まれていますか?

css3dobjectsでレイキャスティングを実行することは可能css3drendererですか?

ご協力ありがとうございました