Having trouble detecting intersections of extruded objects in THREE.js. The objects are created from a 2D geometry as shown below:
var geoShape = new THREE.Shape(vertexes);
var geometry = new THREE.ExtrudeGeometry(geoShape, { bevelEnabled: false, amount: 3 });
var mesh = THREE.SceneUtils.createMultiMaterialObject(geometry,
[new THREE.MeshLambertMaterial({ color: '#493D26' })]
);
scene.add(mesh);
Attempting to detect intersections with the following code:
container.mousedown(function (e) {
event.preventDefault();
var vector = new THREE.Vector3((e.clientX / window.innerWidth) * 2 - 1, -(e.clientY / window.innerHeight) * 2 + 1, 0.5);
projector.unprojectVector(vector, camera);
var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());
var intersects = raycaster.intersectObjects(scene.children);
console.log(intersects);
});
However, the intersects array is always empty. Intersections are only detected when a sphere is added to the scene, but only when zoomed in to z < 18. Any tips or suggestions?