While using THREE.js to display objects on my page, I encountered an issue with clicking objects. Regardless of which object I click, the intersects[0].object.position always shows as x=0, y=0, z=0, even though the actual positions of the objects are different.
Could you please take a look at the code below and provide some insight into what might be causing this problem?
function onDocumentMouseDown(event) {
event.preventDefault();
var vector = new THREE.Vector3((event.clientX / window.innerWidth)*2-1, -(event.clientY / window.innerHeight)*2+1, 0.5);
projector.unprojectVector(vector, camera);
var ray = new THREE.Ray(camera.position, vector.subSelf(camera.position).normalize());
var intersects = ray.intersectObjects(teeth, true);
if (intersects.length > 0) {
//not working
camera.position.x=intersects[0].object.position.x;
//not working
camera.position.y=intersects[0].object.postion.y;
//working
intersects[0].object.material.color.setHex(Math.random()*0xffffff);
}
}