three.js - .gltf模型加载出来为黑色解决办法

不啰嗦，我们直接开始！

前后效果对比

解决前：

解决后

解决方案

截图

核心代码

loader.load( "gltf文件路径或网络地址", function ( gltf ) {
    gltf.scene.name = '3dmodel';
    gltf.scene.traverse( function ( child ) {
    if ( child.isMesh ) {
        child.frustumCulled = false;
        //模型阴影
        child.castShadow = true;
        //模型自发光
        child.material.emissive =  child.material.color;
        child.material.emissiveMap = child.material.map ;
    }})
    this.setContent(gltf.scene);
    scene.add( gltf.scene );
    layer.close(loading);
}, onProgress, onError);

出现原因分析

1. 首先确定是否是gltf格式出现原因：
   使用glft viewer 确定gltf 能否展示，使用win10自带的3D查看器也能展示
2. 查看exposure是否为大于0的数，在webGLRender 中设置
3. 查看emissive和emssiveMap:
   如果使用环境光看到黑色（或者其他纯色），将emssive设置为material.color,如果有纹理，将纹理赋值给emssiMap。

更深层次的问题

渲染不理想：模型颜色比较暗淡，需要设置gamma 相关或者encoding（sRGB or liner）,这里不做过多阐述。

不啰嗦，文章结束，建议三连！