Saturday, 17 August 2013

THREE.js issue with intersecting objects

THREE.js issue with intersecting objects

I'm having an issue detecting object intersections with THREE.js. My
objects are being extruded from a 2D geometry like such:
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);
I am then trying to detect intersection like this:
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);
});
Everytime, my intersects array is empty. If I add a sphere to the scene, I
get intersections, but only if I am zoomed in to z < 18. Any suggestions?

No comments:

Post a Comment