I have created a page that is inspired by this example and have incorporated relevant lines from the webgl_material_bumpmap example to implement a loading progress Dom Element.
You can view the page (temporarily) here. If the information provided below is insufficient, please refer to the source of this page.
One issue I am encountering is that the Loading text block does not disappear after the model is loaded. I am using the following code to display it:
function installModel(file) {
if (model) {
scene.remove(model);
}
render();
var loader = new THREE.JSONLoader(true);
loader.load("obj/" + file, modelLoadedCallback);
document.body.appendChild( loader.statusDomElement );
}
The init function (excluding error handling) looks like this:
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(50, theCanvas.width/theCanvas.height, 0.1, 100);
camera.position.z = 30;
camera.lookAt( scene.position );
controls = new THREE.OrbitControls( camera, renderer.domElement );
controls.damping = 0.3;
controls.addEventListener( 'change', render );
createWorld();
installModel("room1.json");
render();
loader.statusDomElement.style.display = "none";
}
Why is the Loading text still visible even after the model has loaded?