You can define the objects to be selected by raycast yourself.
See from the Collection of examples from discourse.threejs.org :
BeginnerExample step 10
// ... step 10: raycaster
//=================================================================================================
// https://threejs.org/docs/index.html#api/en/core/Raycaster
const raycaster = new THREE.Raycaster( ); // see function raycasting( ); in animate
const mouse = new THREE.Vector2( ); // see function onWindowMousemove( event )
let intersects = []; // array of intersected objects
// https://threejs.org/docs/index.html#api/en/geometries/OctahedronGeometry
const ohGeometry = new THREE.OctahedronGeometry( 0.3 );
const ohMesh = new THREE.Mesh( ohGeometry, new THREE.MeshPhongMaterial( { color: 0xff0045 } ) );
scene.add( ohMesh );
const objs = [ ohMesh, flowerMesh, modelLh, ballMesh, diceMesh, sandPileMesh, rampMesh, stemMesh, flagpoleMesh, flagMesh, sfSprite, sheetMesh ];
const infos = [ 'octahedron', 'flower', 'lighthouse', 'ball', 'dice', 'sand', 'ramp', 'stem', 'pole', 'three.js', 'sunflower', 'sheet' ]
let index = 0;
objs.forEach( obj => { obj.name = infos[ index ]; index ++; } ); // names for some objects
// ======= to step 10 ============
function raycasting( ) {
if( range.value > 9.5 && range.value < 10.5 ) { // only step 10
raycaster.setFromCamera( mouse, camera );
intersects = raycaster.intersectObjects( objs ); // objs - objects to raycast
if ( intersects.length > 0 ) { // hit
info.style.fontSize = '5vh';
info.style.color = 'white';
info.innerHTML = ' you got a hit => ' + intersects[ 0 ].object.name; // ...[ 0 ] first intersected object
ohMesh.material.color.setHex( 0x4500ff );
} else {
info.style.fontSize = '1.9vh';
info.style.color = 'black';
info.innerHTML = 'Beginner Example';
ohMesh.material.color.setHex( 0xff0045 );
}
}
}