Question

Link to webpage: http://door-in-wall.asg-3d.ru

Source: http://door-in-wall.asg-3d.ru/source.zip

After calling init() initializes the scene: added camera, light, generated geometry (text and sphere), and loaded with JSonLoader 3D model.
Camera, light and generated geometry has be added to the scene immediately, but when JSonLoader loads the model – I can not understand …

  // Create 3D Text Mesh
  var textMesh3 = new THREE.Mesh( text3d3, textMaterial );
  textMesh3.position.x = textMesh1.position.x;
  textMesh3.position.y = textMesh2.position.y - text3d1.boundingBox.max.y * 2.6;

  scene.add( textMesh3 );

  console.log('textMesh3 within init() = ', textMesh3); //textMesh3 = THREE.Mesh
  console.log('scene.children.length after load textMesh3 = ', scene.children.length); //scene.children.length = 6


  // Add back plane
  var loader = new THREE.JSONLoader().load( "js/backplane.js", function ( geometry ) {

    geometry.computeBoundingBox();

    backPlaneMesh = new THREE.Mesh( geometry, backPlaneMeshMaterial );
    backPlaneMesh.position.set(SCREEN_WIDTH, 0, 0);
    backPlaneMesh.scale.set(4, 4, 4);

    scene.add(backPlaneMesh);

  });

  console.log('JSONLoader within init() = ', loader); //loader = undefined 
  console.log('scene.children.length after load JSONLoader = ', scene.children.length); //scene.children.length = 6

I left the console output to a descendant of scene console.log (scene.children.length): Line 103, 148, 167.

If you check scene.children.length after calling animate() and render(), then it will show the presence of 7 children.

How and when model is loading with JSONLoader?

Answer 1

loader.load() is asynchronous. In other words, it doesn’t stop the code execution until is completed. It will load in parallel and will execute the callback when is done. Depending on how big the model is it may take some seconds to download and parse. Even if you’re loading it locally it will take some milliseconds.