异常:可修改颜色但不能加贴图,图片路径无误

实际使用中的部分关键代码

//新建纹理
var texture = new THREE.TextureLoader().load( "texture/Bricks052_1K_Color.jpg" );
        texture.encoding = THREE.sRGBEncoding;
        texture.flipY = false;
        texture.needsUpdate = true;
        texture.wrapS = THREE.RepeatWrapping;
        texture.wrapT = THREE.RepeatWrapping;
        texture.repeat.set( 4, 4 );
//新建材质
var tmaterial = new THREE.MeshStandardMaterial({ map: texture });
//加载模型部分代码
loader.load('model/000.glb',( gltf )=> {
            //改变子模型材质
            gltf.scene.children[0].material = tmaterial
            gltf.scene.children[0].material.needsUpdate  = true;
            gltf.scene.traverse( function ( child ) {
              //放射光颜色与放射光贴图 不设置可能导致黑模
              if ( child.isMesh ) {
                child.material.emissive =  child.material.color;
                child.material.emissiveMap = child.material.map ;
              }

            } );
            const senc = gltf.scene || gltf.scene[0];
            this.scene.add( senc  );
            //创建一个网格 将 宽度x =100 y=200 z=100、分段数皆为1立方体 与 材质 添加进去;
            //向场景添加长方体网格对象
          }, undefined, function ( error ) {

            console.error('加载错误:'+ error );

          } );

代码经使用盒模型测试替换效果是无误的

但是gltf模型只能改变颜色却无法显示贴图,经过一番苦苦搜索发现问题应该是模型本身的设置问题

导出的原模型不论有无贴图都须添加UVmap设置才能在threejs中操作,这里以Blender软件界面为例

Logo

技术共进,成长同行——讯飞AI开发者社区

更多推荐