Threejs.org/examples/#m…

  • The statement
const selectionBox = new SelectionBox( camera, scene );
const helper = new SelectionHelper( selectionBox, renderer, 'selectBox' );
Copy the code
  • The mouse to click
document.addEventListener( 'pointerdown'.function ( event ) {
        for ( const item of selectionBox.collection ) {
                item.material.emissive.set( 0x000000 );
        }
        selectionBox.startPoint.set(
                ( event.clientX / window.innerWidth ) * 2 - 1,
                - ( event.clientY / window.innerHeight ) * 2 + 1.0.5); });Copy the code
  • The mouse moves
document.addEventListener( 'pointermove'.function ( event ) {
        if ( helper.isDown ) {
                for ( let i = 0; i < selectionBox.collection.length; i ++ ) {
                        selectionBox.collection[ i ].material.emissive.set( 0x000000 );
                }

                selectionBox.endPoint.set(
                        ( event.clientX / window.innerWidth ) * 2 - 1,
                        - ( event.clientY / window.innerHeight ) * 2 + 1.0.5 );

                const allSelected = selectionBox.select();
                for ( let i = 0; i < allSelected.length; i ++ ) {
                        allSelected[ i ].material.emissive.set( 0xffffff); }}});Copy the code
  • The mouse is raised
document.addEventListener( 'pointerup'.function ( event ) {
        selectionBox.endPoint.set(
                ( event.clientX / window.innerWidth ) * 2 - 1,
                - ( event.clientY / window.innerHeight ) * 2 + 1.0.5 );
        const allSelected = selectionBox.select();
        for ( let i = 0; i < allSelected.length; i ++ ) {
                allSelected[ i ].material.emissive.set( 0xffffff); }});Copy the code