第一步:引入gltfloader

在这里插入图片描述

导入gltf并贴图代码:

let loader = new THREE.GLTFLoader(); /*实例化加载器*/
    var textureNormal = textureLoader.load('./images/ambient_occlusion.jpg');
    loader.load('./model/dnz.gltf', function(obj) {
      console.log(obj);
      obj.scene.scale.set(5, 10, 5);
      obj.scene.position.x = px;
      obj.scene.position.y = py;
      obj.scene.position.z = pz;

      obj.scene.rotation.y = ry;

      obj.scene.traverse(function (gltf) {
        if(gltf.type === 'Mesh'){
          gltf.material = new THREE.MeshPhongMaterial({
            color: 0xcccccc,
            map:textureNormal,
            normalScale: new THREE.Vector2(3, 3),
          })
        }

      })

      scene.add(obj.scene);
    })

备注:加载贴图要先申明贴图模型

let textureLoader = new THREE.TextureLoader();

除此以外对gltf格式的操作在obj.sence中。一定要用遍历traverse否则会报错。

Logo

旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐