Question

I’m trying to build a galaxy view with three.js which is working pretty good excepted one part.
When I click on a sphere the point isn’t always correct.
Here is the code that i use for the ray:

mouseX = 2 * (c.pageX / SCREEN_WIDTH) - 1;
mouseY = 2 * -(c.pageY / SCREEN_HEIGHT) + 1;
c = new THREE.Vector3(mouseX, mouseY, 0.5);
c = projector.unprojectVector(c, camera);
ray = new THREE.Ray(camera.position, c.subSelf(camera.position).normalize());
c = ray.intersectObjects(scene.children);
0 < c.length && (sphere.id == c[0].object.id ? 1 < c.length && (i(c[1].object), debug(c[1].object.id), sphere.position = c[1].point) : (i(c[0].object), sphere.position = c[0].point))

Which works if the object isn’t far positioned from the center of the scene,
however I won’t have every planet near the center and that’s where I get the problems. The further i get away from the center the larger the error seems to be.

Here is a simple working version of the code
http://jsfiddle.net/PHKTL/

Any help is appreciated!

Answer 1

The problem is that because you use such large numbers while the intersection code is using numbers from 0 to 1 which creates such large errors in the calculation.