一部を除いてかなりうまく機能しているthree.jsで銀河ビューを構築しようとしています。球をクリックすると、点が常に正しいとは限りません。レイに使用するコードは次のとおりです。
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))
これは、オブジェクトがシーンの中心から遠く離れていない場合に機能しますが、
すべての惑星が中心近くにあるとは限らないため、問題が発生します。中心から離れるほど、誤差が大きくなるようです。
コード
http://jsfiddle.net/PHKTL/の単純な作業バージョンを次に示します。
どんな助けでも大歓迎です!