圆半径相交(像一个圆形光标刷)-三个js

我希望能够在圆形光标的半径内捕捉对象的面(如在绘画/photoshop中)。

我会告诉你它是什么https://jsfiddle.net/Shaggisu/w7ufmutr/9/

我不仅希望能够选择与鼠标点相交的单个面，而且希望能够选择可能在圆形半径内的所有面，我试图为该光标上传一些图像，但无法真正使其与jsfiddle中的外部文件一起工作。

我的问题是，是否有一些标准的方法来实现在指定半径内的多次选择/交叉，或者我是否应该设计一些代码，例如在特定时刻在鼠标点周围的周围面重复。

我对three.js还很陌生，所以我想问一些指导，特别是如果有一些可靠的方法来实现，任何提示都会很有帮助。

    var brushTexture = THREE.ImageUtils.loadTexture( '/cur_circle.png' );
var brushMaterial = new THREE.SpriteMaterial( { map: brushTexture, useScreenCoordinates: true, alignment: THREE.SpriteAlignment.center } );

  brushSprite = new THREE.Sprite( brushMaterial );
  brushSprite.scale.set( 32, 32, 1.0 );
  brushSprite.position.set( 50, 50, 0 );
  scene.add( brushSprite );
  //////////////////////////////////////////////////////////////////////
    // initialize object to perform world/screen calculations
    projector = new THREE.Projector();
    // when the mouse moves, call the given function
    document.addEventListener( 'mousedown', onDocumentMouseDown, false );
}
function onDocumentMouseDown( event ) 
{
    // the following line would stop any other event handler from firing
    // (such as the mouse's TrackballControls)
    event.preventDefault();
    console.log("Click.");

    // update the mouse variable
    mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
    mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
    // find intersections
    // create a Ray with origin at the mouse position
    //   and direction into the scene (camera direction)
    var vector = new THREE.Vector3( mouse.x, mouse.y, 1 );
    projector.unprojectVector( vector, camera );
    var ray = new THREE.Raycaster( camera.position, vector.sub( camera.position ).normalize() );
    // create an array containing all objects in the scene with which the ray intersects
    var intersects = ray.intersectObjects( targetList );
    // if there is one (or more) intersections
    if ( intersects.length > 0 )
    {
  controls.enabled = false;  // stops camera rotation
        console.log("Hit @ " + toString( intersects[0].point ) );
        // change the color of the closest face.
        intersects[ 0 ].face.color.setRGB( 0.8 * Math.random() + 0.2, 0, 0 ); 
        intersects[ 0 ].object.geometry.colorsNeedUpdate = true;
    document.addEventListener( 'mousemove', onDocumentMouseMove, false );
    }
}
function onDocumentMouseMove( event){
event.preventDefault();
mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
brushSprite.position.set( event.clientX, event.clientY, 0);
// find intersections
    // create a Ray with origin at the mouse position
    //   and direction into the scene (camera direction)
    var vector = new THREE.Vector3( mouse.x, mouse.y, 1 );
    projector.unprojectVector( vector, camera );
    var ray = new THREE.Raycaster( camera.position, vector.sub( camera.position ).normalize() );
    // create an array containing all objects in the scene with which the ray intersects
    var intersects = ray.intersectObjects( targetList );
    // if there is one (or more) intersections
    if ( intersects.length > 0 )
    {
        console.log("Hit @ " + toString( intersects[0].point ) );
        // change the color of the closest face.
        intersects[ 0 ].face.color.setRGB( 0.8 * Math.random() + 0.2, 0, 0 ); 
        intersects[ 0 ].object.geometry.colorsNeedUpdate = true;
    }
document.addEventListener( 'mouseup', onDocumentMouseUp, false );
}
function onDocumentMouseUp( event){
event.preventDefault();
document.removeEventListener( "mousemove", onDocumentMouseMove);
controls.enabled = true;
}

该代码是我用于实践的stemkoskis github的修改版本。我已经对它进行了一些扩展，用于交叉事件和连续选择的相机管理，但半径内多个面的选择是我现在最感兴趣的。