three.js加载glb模型

对于加载 glb 模型，使用 Three.js 是相对简单的。下面是一个简单的示例代码：

// 创建场景
const scene = new THREE.Scene();

// 创建相机
const camera = new THREE.PerspectiveCamera(
  75,
  window.innerWidth / window.innerHeight,
  0.1,
  1000
);
camera.position.z = 5;

// 创建渲染器
const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

// 加载模型
const loader = new THREE.GLTFLoader();
loader.load(
  'path/to/your/model.glb',
  function (gltf) {
    scene.add(gltf.scene);
  },
  undefined,
  function (error) {
    console.error(error);
  }
);

// 渲染场景
function animate() {
  requestAnimationFrame(animate);
  renderer.render(scene, camera);
}
animate();

在这个示例中，我们首先创建了一个场景、相机和渲染器。然后使用 `THREE.GLTFLoader` 来加载 glb 模型，并将加载后的模型添加到场景中。最后，通过 `requestAnimationFrame` 循环调用 `renderer.render` 来渲染场景。

记得将 `'path/to/your/model.glb'` 替换为你实际的模型文件路径。请确保已经将 Three.js 库和 GLTFLoader 添加到你的 HTML 文件中。

希望这可以帮到你！如果有任何疑问，请随时提问。