3球の球の中心に対する軌道の精度

Question

私は、球が表示されているような球が表示されるような射手をユーザーが撮影する必要があります。 球を撮影した後、オブジェクトは消え、別の球がポップアップします。私はポインタロックコントロールを使用しています。

球を使用して撮影しますとき、私は検出：

  function onDocumentMouseDown(event) { 
       var mouse3D = new THREE.Vector3(); 
       var raycaster = new THREE.Raycaster(); 
       mouse3D.normalize(); 
       controls.getDirection(mouse3D); 
       raycaster.set(controls.getObject().position, mouse3D); 
       var intersects = raycaster.intersectObjects(objects); 
       // Change color if hit sphere 
       if (intersects.length > 0) { 
        intersects[ 0 ].object.material.color.setHex(Math.random() * 0xffffff); 
        //hide shpere 
        object.traverse(function(child){child.visible = false;}); 
        update_sphereplace(); 
       } 
      } 

これは完璧に動作しますが、今私は、精度の機能を統合したいです。 どのように球の中心に基づいて精度を追跡できますか？例えば、中心を打つと、100の精度が得られるはずです。中心から比較的離れた球に当てると、0に近い精度が得られます（ただし、0は球がないため0になりません）。

Answer 1

どのように光線が球メッシュの中心から外れているかを知る必要があります。

var missDistance = raycaster.ray.distanceToPoint(intersects[ 0 ].object.position); 

はその後、スコアにその値をマッピングする必要があります - のようなもの：

var score = 100 * Math.max(1 - (missDistance/sphereRadius), 0); 

three.js r.76