6

我正在尝试通过以下包装函数为从 OBJLoader 加载的网格定义材质：

function applyTexture(src){
    var texture = new THREE.Texture();
    var loader = new THREE.ImageLoader();
    loader.addEventListener( 'load', function ( event ) {
        texture.image = event.content;
        texture.needsUpdate = true;

        // find the meshes from the loaded OBJ and apply the texture to it.
        object.traverse( function ( child ) {
            if ( child instanceof THREE.Mesh ) {
                if(child.name.indexOf("Lens") < 0){
                    child.dynamic = true;

                   child.material = new THREE.MeshLambertMaterial( { color: 0xdddddd, shading: THREE.FlatShading, map : texture } );
                   // also tried:
                   //child.material = new THREE.MeshPhongMaterial( { color: 0x000000, specular: 0x666666, emissive: 0x000000, ambient: 0x000000, shininess: 10, shading: THREE.SmoothShading, map : texture} );
                   // and:
                   //child.material = new THREE.MeshBasicMaterial({map : texture});
                   child.material.map = texture; // won't throw the WebGL Warning, but won't show the texture either;
               } else {
                   // works just fine.
                   child.material = new THREE.MeshPhongMaterial( { color: 0x000000, specular: 0x666666, emissive: 0x000011, ambient: 0x000000, shininess: 10, shading: THREE.SmoothShading, opacity: 0.6, transparent: true } );
               }
            }
        });
    });
    loader.load( src );
}

当纹理已加载并且是时候将材质应用于网格时，我开始在控制台上收到以下警告：

.WebGLRenderingContext: GL ERROR :GL_INVALID_OPERATION : glDrawElements: attempt to access out of range vertices in attribute 0

并且网格本身消失了。

我在这里做错了什么？

更新

正如@WestLangley 在评论中指出的那样：永远不要在渲染后尝试应用纹理/材质。在将对象渲染到场景之前创建材质，然后使用以下方法更改它们：

obj.material.map = texture
4

2 回答 2

13

使用WebGLRenderer，您无法在网格渲染一次后从没有纹理的材质切换到有纹理的材质。这是因为，如果没有初始纹理，几何体将没有必要的烘焙 WebGL UV 缓冲区。

一种解决方法是从具有简单白色纹理的材料开始。

更新：或者，您可以从无纹理材质开始，然后在添加纹理时设置以下标志：

material.needsUpdate = true;
geometry.buffersNeedUpdate = true;
geometry.uvsNeedUpdate = true;

三.js r.58

于 2013-05-14T01:38:04.280 回答
2

从搅拌机加载场景时，我也遇到了这个错误。对我来说，当我为每个我想要有纹理的网格展开 uv 时，这个问题已经解决了。

于 2013-11-06T14:04:11.703 回答