GLTF model loading but its not appearing

Questions
1

Hi,

I just started with Three.JS and I am trying to load an animated GTLF model in my code, but for some reason, the model is not appearing, I tried playing with the camera position, but still it’s not appearing.

<body>
  <div class="scene"></div>
</body>
const container = document.querySelector(".scene");

const scene = new THREE.Scene();

const camera = new THREE.PerspectiveCamera(80, container.clientWidth / container.clientHeight);
camera.position.set(100,100,100);

const renderer = new THREE.WebGLRenderer({ alpha: true });
renderer.shadowMap.enabled = true;
renderer.setSize(container.clientWidth, container.clientHeight);
renderer.setPixelRatio(window.devicePixelRatio);

container.appendChild(renderer.domElement);

const loader = new THREE.GLTFLoader();

loader.load("../models/running/scene.gltf", function (gltf) {
  const model = gltf.scene;
  scene.add(model);
  animate();
}, undefined,
  function (error) {
    console.error(error);
  });

function animate() {
  renderer.render(scene, camera);
}

The model I am using is from sketchfab.com
https://sketchfab.com/3d-models/cyberpunk-character-animated-d97c9947fb184904a58dd637f86d0a88

2

Please check the troubleshooting steps explained here: https://threejs.org/docs/#manual/en/introduction/Loading-3D-models