threejs加载glb模型

Threejs是一款基于WebGL渲染引擎的JavaScript库，它可以在web端展示3D模型，其中加载glb模型是其中一种常见方式。

首先，需要在html文件中引入threejs的js文件和相关加载器 。然后，创建一个场景、相机和渲染器。接着，使用GLTFLoader加载glb模型。代码如下：

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r121/three.min.js"></script>
<script src="https://cdn.rawgit.com/mrdoob/three.js/r68/examples/js/loaders/GLTFLoader.js"></script>

<script>
    var scene = new THREE.Scene();  // 创建场景
    var camera = new THREE.PerspectiveCamera(45, window.innerWidth/window.innerHeight, 0.1, 1000);  // 创建相机
    var renderer = new THREE.WebGLRenderer();  // 创建渲染器
    renderer.setSize(window.innerWidth, window.innerHeight);
    document.body.appendChild(renderer.domElement);

    var loader = new THREE.GLTFLoader();  // 创建glb loader
    loader.load('model.glb', function(glb){  // 加载glb模型
        // 添加模型到场景中
        scene.add(glb.scene);
    }, function(xhr){
        console.log((xhr.loaded / xhr.total * 100) + '% loaded');  // 显示加载进度
    }, function(error){
        console.log(error);  // 加载出错显示错误信息
    });
</script>

通过以上代码可实现加载glb模型并展示在web页面中。同时，threejs提供丰富的API，可以调整模型的位置、旋转角度、材质等属性，满足不同的交互需求。