title: How to case switch between models in THREE.js
body: <p>Im writing a program in THREE.js where I would like a key press to change the current model loaded. I have gotten this to work fairly simply using the built in mesh's in THREE, but when I try to use the same framework in imported .glb files, it wont work.</p>
  <p>Here is my <code>loader</code> function:</p>
  <pre><code>let charSelect = &quot;models/charMod.glb&quot;;
  
  loader = new GLTFLoader();
  
  function loadModels() {
    const onLoadStatic = function (gltf, position) {
      charModel = gltf.scene.children[2];
      scene.remove(charModel);
      charModel.scale.multiplyScalar(4);
      charModel.position.copy(position);
      modelLoaded = true;
      scene.add(charModel);
    };
  
    const onProgress = function () {
      console.log(&quot;progress&quot;);
    };
  
    const onError = function (errorMessage) {
      console.log(errorMessage);
    };
  
    const modPos = new THREE.Vector3(0, -3.5, 0);
    loader.load(
      charSelect,
      function (gltf) {
        onLoadStatic(gltf, modPos);
      },
      onProgress,
      onError
    );
  </code></pre>
  <p>My case switch:</p>
  <pre><code>function caseSwitch() {
    switch (caseNum) {
      case 1:
        charSelect = &quot;models/idle.glb&quot;;
        loadModels();
        break;
  
      case 2:
        charSelect = &quot;models/kick.glb&quot;;
        loadModels();
        break;
  
      default:
        charSelect = &quot;models/charMod.glb&quot;;
        loadModels();
    }
  }
  </code></pre>
  <p>As I said, this worked with the default THREE.js mesh, but not with this. Anyone know a fix for this? Thanks :)</p>