GLTFLoader error: Cannot read property 'itemStart' of undefined

Question

For the sake of saving 12 megs I've got to switch from an OBJloader to GLTFLoader only I get the error:

Uncaught TypeError: Cannot read property 'itemStart' of undefined

html

  <script src="https://cdn.rawgit.com/mrdoob/three.js/master/examples/js/loaders/GLTFLoader.js"></script>

...

  // Load the creature
  function load_creature()
  {
        // creature loader

        var images = [
            "./textures/00.jpg",
        ];


        var texture = new THREE.TextureLoader().load( images[0] );

     // var loader = new THREE.OBJLoader();
     var loader = new THREE.GLTFLoader();


     // var creature = './obj/trex.obj'
     var creature = './gltf/trex.gltf'

    // Load a glTF resource
    loader.load(

        // resource URL
        './gltf/rex.gltf',

        // called when the resource is loaded
        function ( gltf ) {

            scene.add( gltf.scene );

            gltf.animations; // Array<THREE.AnimationClip>
            gltf.scene; // THREE.Scene
            gltf.scenes; // Array<THREE.Scene>
            gltf.cameras; // Array<THREE.Camera>
            gltf.asset; // Object

        },
        // called while loading is progressing
        function ( xhr ) {

            console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );

        },
        // called when loading has errors
        function ( error ) {

            console.log( 'An error happened' );

        }
    );


    // Load creature
    var trex = load_creature();

I'm new to three.js and I can't see where I'm going wrong. Any ideas?

Answer 1

When you open the console in your project you can see the ThreeJS version in the very first line:

THREE.WebGLRenderer 96

Make sure your GLTFLoader has the same version. So in my case it's 96.

https://rawcdn.githack.com/mrdoob/three.js/r96/examples/js/loaders/GLTFLoader.js

Make sure you modify the bold part of the URL to your ThreeJS Version to get the right code.

Thanks Mugen87 for providing the Informations I just wanted to wrap it up.

Answer 2

Please ensure that your three.js library file and external example files like GLTFLoader are from the same release. We had the exact same issue some time ago in the three.js forum and the root cause was a version mismatch of the used files.

three.js R112