title: threejs, animejs, can't "animate on scroll" imported gltf files. only primitives working
body: <p>I was experimenting with threejs, animations (animejs) and scroll event.
  here's a working codepen: <a href="https://codepen.io/cristigoia/pen/JjPMQMP" rel="nofollow noreferrer">https://codepen.io/cristigoia/pen/JjPMQMP</a></p>
  <p>On line 30 i add the cube to the scene:</p>
  <pre class="lang-js prettyprint-override"><code>function addCube () {
      cube = new THREE.Mesh( new THREE.BoxGeometry( 50, 50, 50 ), new THREE.MeshNormalMaterial() );
      cube.position.y = 5
      cube.position.z = -100
      scene.add(cube);
  }
  </code></pre>
  <p>on line 37 I init and set the timeline</p>
  <pre class="lang-js prettyprint-override"><code>function initTimeline() {
    timeline = anime.timeline({
      autoplay: false,
      duration: 4500,
      easing: 'easeOutSine'
    });
    timeline.add({
      targets: cube.position,
      x: 100,
      y: 25,
      z: -50,
      duration: 2250,
      update: camera.updateProjectionMatrix()
    })
    timeline.add({
      targets: cube.position,
      x: 0,
      y: 0,
      z: 50,
      duration: 2250,
      update: camera.updateProjectionMatrix()
    })
    var value = new THREE.Color(0xFFFCFC)
    var initial = new THREE.Color(0x161216)
    timeline.add({
      targets: initial,
      r: [initial.r, value.r],
      g: [initial.g, value.g],
      b: [initial.b, value.b],
      duration: 4500,
      update: () =&gt; {
        renderer.setClearColor(initial);
      }
    }, 0);
  }
  </code></pre>
  <p>Ok so this is perfect, the only problem is that this is working with primitives only (box, cylinder, spherere, whatever)
  Whenever I try to load a custom GLTF through <code>GLTFLoader</code> the thing get broken and I really can't solve it even if I think I'm near to debug the problem.</p>
  <p>I'm trying to load another model like this:</p>
  <pre class="lang-js prettyprint-override"><code>import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';
  
  var loader = new GLTFLoader();
  
  var something;
  function addSomething() {
  
    loader.load(&quot;./assets/something.gltf&quot;, function(gltf) {
      something = gltf.scene;
      scene.add(something);
  
    });
  }
  </code></pre>
  <p>and everything looks good (if I stay inside this function)
  but as long as I go outside the function, no matter what I do, errors happen.. (I tried different things and got different errors: from errors like &quot;something is null&quot;, &quot;something is not declared&quot;,  to errors like &quot;no error shown but at the same time nothing happens&quot;)</p>
  <p>If I try to initialize the timeline and animate the model like I did above with the cube, nothing is working, and I'm stuck here. I tried different thing to solve this, but now I have to &quot;give up&quot; and ask for help, but I'm pretty confident it's an easy task to fix and I'm just braindead right now..</p>
  <p>If you can show me how this can be solved I would be very grateful. Thank you</p>