vue+three

• 使用GLTFLoader加载本地模型时，需要将模型放在public文件夹中,然后输入public下模型的存放地址即可，否则会出现加载不了模型
• 加载gltf模型时出现发黑的情况有两种解决方案
  • 给材质添加自发光

    gltfLoader.load('111.gltf', (gltf) => {
    
            gltf.scene.traverse( (child)=> {
    
              if ( child.isMesh ) {
                console.log(child)
                child.material.emissive =  child.material.color;
                child.material.emissiveMap = child.material.map ;
              }
    
            })
            var model = gltf.scene
            scene.add(model)
    
    })
    // 当材质本身没有颜色时，会出现过白的情况

  • 添加平行光

    // 添加平行光，参数1：灯光颜色 参数2：灯光亮度
    const directionalLight = new THREE.DirectionalLight('#ffffff',5)
    // 灯光从那个方向进行照射
    directionalLight.position.set(0.25,3,-2.25)
    // 添加进场景
    scene.add(directionalLight)