I am new to THREE js I can't figure out the error
when I am run my code the following error is showing
Uncaught TypeError: THREE.GLTFLoader is not a constructor
var loader = new THREE.GLTFLoader();
loader.load('modelReq/Gully_update_2.gltf',
function (gltf) {
scene.add(gltf.scene);
gltf.animations;
gltf.scene;
gltf.scenes;
gltf.cameras;
gltf.asset;
},
function (xhr) {
console.log((xhr.loaded / xhr.total * 100 ) + '% loaded' );
},
function (error) {
console.log( 'An error happened = ', error );
}
);
and error is at var loader = new THREE.GLTFLoader();
My html file :
<link rel="stylesheet" href="css/main.css">
<script src="js/plugins/three.min.js"></script>
<script src="js/plugins/TrackballControls.js"></script>
<script src="js/plugins/stats.min.js"></script>
<script src="js/plugins/GLTFLoader.js"></script>
<script src="js/custom.js"></script>
</head>
<body>
<div id="animate">
<canvas></canvas>
</div>
and the GLTFLoader.js is in the path : <script src="js/plugins/GLTFLoader.js"></script>
GLTFLoader is in a separate file...
<script src="https://cdn.rawgit.com/mrdoob/three.js/master/examples/js/loaders/GLTFLoader.js"></script>
For me error was not including 'import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With