three.js - Three.js - 模型导入场景后不显示

Question

所以我做了一个简单的搅拌机模型，想把它导入到我的场景中。

这是可能令人不安的部分代码：

// Canvas
const canvas = document.querySelector('canvas.webgl')

// Scene
const scene = new THREE.Scene()

const dracoLoader = new DRACOLoader() //must be added before
//dracoLoader.setDecoderPath('/draco/')

const gltfLoader = new GLTFLoader()
gltfLoader.setDRACOLoader(dracoLoader)



gltfLoader.load('/models/hamburger.glb', (gltf) => {
    scene.add(gltf.scene);

})


//Objects

const floor = new THREE.Mesh(
    new THREE.PlaneGeometry(50, 50),
    new THREE.MeshStandardMaterial({
        color: 0x444444,
        metalness: 0,
        roughness: 0.5
    })
)

floor.receiveShadow = true
floor.rotation.x = -  Math.PI * 0.5 
scene.add(floor)

const ambientLight = new THREE.AmbientLight(0xffffff, 0.8)
scene.add(ambientLight)

const directionalLight = new THREE.DirectionalLight(0xffffff, 0.6)
directionalLight.castShadow = true
directionalLight.shadow.mapSize.set(1024, 1024)
directionalLight.shadow.camera.top = 7
directionalLight.shadow.camera.bottom = - 7
directionalLight.shadow.camera.right = 7
directionalLight.shadow.camera.left = - 7
directionalLight.shadow.camera.far = 15
directionalLight.position.set(5, 5, 5)
scene.add(directionalLight)

const camera = new THREE.PerspectiveCamera(75, sizes.width / sizes.height, 0.1, 100)
camera.position.z = 2
camera.position.x = 2
camera.position.y = 2

但是，当我尝试导入它时，即使我没有收到任何错误并且其他一切正常，它也没有显示。

标签： three.js