I'm fairly new to 3D and Threejs.
I've created a scene with a ground, where many cubes are positioned on top of it.
http://jsfiddle.net/whurp02s/1/
My goal is to select the cubes that intersect with the yellow rectangle.
To achieve this, I researched online and came across the Raycaster object along with its intersectObject function:
//**************** colision detection
var caster = new THREE.Raycaster();
var collisions = [];
var rays = [
new THREE.Vector3(0, 0, 1),
new THREE.Vector3(1, 0, 1),
new THREE.Vector3(1, 0, 0),
new THREE.Vector3(1, 0, -1),
new THREE.Vector3(0, 0, -1),
new THREE.Vector3(-1, 0, -1),
new THREE.Vector3(-1, 0, 0),
new THREE.Vector3(-1, 0, 1)
];
for (var i = 0; i < rays.length; i += 1) {
caster.set(squareTL.position, rays[i]);
for(var boxId in boxGroup) {
var boxObj = boxGroup[boxId];
collisions = caster.intersectObject(boxObj);
if(collisions.length) {
console.log(collisions);
} else console.log("no collision");
}
}
However, despite implementing this code, I am not getting any collisions detected.
It seems like there is something crucial that I'm overlooking...