Actualmente estoy usando el siguiente código para permitir que el usuario cargue su modelo CAD en el lienzo de threejs.

 <input type="file" id="file-to-upload" onchange="readFile(this);">

 window.readFile = function readFile(input) { let file = input.files[0]; const reader = new FileReader(); reader.addEventListener( 'load', async function ( event ) { const manager = new THREE.LoadingManager(); const loader = new ThreeMFLoader( manager ); object= loader.parse( event.target.result ); scene.add(object); manager.onLoad = function () { render(); }; renderer.render(scene, currentCamera) }, false ); reader.readAsArrayBuffer( file ); } }

Sin embargo, cuanto más grandes sean los archivos, más tiempo tardará el modelo en mostrarse en la escena. No tengo ningún problema con los tiempos de carga más largos, pero a veces aparece el siguiente mensaje emergente:

Luego, el usuario debe hacer clic en "Esperar" y el modelo finalmente se cargará después de un tiempo. Además, durante el período de espera para que el modelo se cargue en la escena, el navegador parece estar congelado, es decir, el usuario no puede rotar la cámara en la escena ni hacer clic en ningún botón.

He estado tratando de eliminar el mensaje emergente "esperar" y evitar que el navegador parezca estar congelado al incluir una barra de progreso usando el código que encontré aquí . Sin embargo, la barra de progreso pasa directamente del 0 % al 100 % una vez que el modelo está en la escena, por lo que creo que la barra de progreso también se congela durante el tiempo que tarda en cargarse el modelo. ¿Cómo puedo eliminar el mensaje emergente "esperar" y mostrarle al usuario que el modelo se está cargando en la barra de progreso?