Question

更新纹理后，我的平铺图像出现问题。我正在更新的纹理是相同的尺寸，即256x256。以下是我尝试更新时发生的情况：http://i.imgur.com/Trrqy1g.jpg

我目前正在使用最新版本的three.js，即带有Mirror.js的版本68

更新功能：

function test(){
    mesh = scene.getObjectByName("Plane",true);
    texturex = THREE.ImageUtils.loadTexture( "images/mosaic_tiles_leaf_pattern_201005060.JPG");
    mesh.material.uniforms.diffuseSampler.value = texturex;
}

着色器代码：

    mirror_shader = {

            uniforms: { "mirrorColor": { type: "c", value: new THREE.Color(0x7F7F7F) },
                        "diffuseSampler": { type: "t", value: null },
                        "mirrorSampler": { type: "t", value: null },
                        "textureMatrix" : { type: "m4", value: new THREE.Matrix4() },
                        "repeatX" : {type:"i", value: 1},
                        "repeatY" : {type:"i", value:1}
            },

            vertexShader: [

                "uniform mat4 textureMatrix;",

                "varying vec4 mirrorCoord;",
                "varying vec2 texCoord;",
                "varying vec3 vNormal;",
                "varying vec3 eyeVec;",

                "void main() {",

                    "vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",
                    "vec4 worldPosition = modelMatrix * vec4( position, 1.0 );",
                    "texCoord = uv;",
                    "mirrorCoord = textureMatrix * worldPosition;",
                    "eyeVec = -mvPosition.xyz;",
                    "vNormal = normalize(normalMatrix * normal);",
                    "gl_Position = projectionMatrix * mvPosition;",

                "}"

            ].join("\n"),

            fragmentShader: [

                "uniform vec3 mirrorColor;",
                "uniform sampler2D diffuseSampler;",
                "uniform sampler2D mirrorSampler;",
                "uniform int repeatX;",
                "uniform int repeatY;",

                "varying vec4 mirrorCoord;",
                "varying vec2 texCoord;",
                "varying vec3 vNormal;",
                "varying vec3 eyeVec;",
                "float blendOverlay(float base, float blend) {",
                    "return( base < 0.5 ? ( 2.0 * base * blend ) : (1.0 - 2.0 * ( 1.0 - base ) * ( 1.0 - blend ) ) );",
                "}",

                "void main() {",
                    "vec4 color = texture2D(diffuseSampler, texCoord * vec2(repeatX,repeatY));",
                    "vec4 mColor = texture2DProj(mirrorSampler, mirrorCoord);",
                    "mColor = vec4(blendOverlay(mirrorColor.r, mColor.r), blendOverlay(mirrorColor.g, mColor.g), blendOverlay(mirrorColor.b, mColor.b), 1.0);",
                    "color = mix(mColor, color, clamp(dot(vNormal, normalize(eyeVec)/2.0+0.4), 0.4, 0.9));",
                    "gl_FragColor = color;",

                "}"

            ].join("\n")

        };      

    var mesh = scene.getObjectByName("Plane",true);
    if(mesh){
            repeat_x = mesh.material.map.repeat.x;
            repeat_y = mesh.material.map.repeat.y;

            customMaterial = new THREE.ShaderMaterial( { fragmentShader: mirror_shader.fragmentShader, vertexShader: mirror_shader.vertexShader, uniforms: mirror_shader.uniforms } );
            customMaterial.uniforms.diffuseSampler.value = mesh.material.map;//roadTexture;

            my_mirror = new THREE.Mirror( renderer, camera, { clipBias: 0.005, textureWidth: SCREEN_WIDTH, textureHeight: SCREEN_HEIGHT} );

            customMaterial.uniforms.mirrorSampler.value = my_mirror.texture;
            customMaterial.uniforms.textureMatrix.value = my_mirror.textureMatrix;                                  
            customMaterial.uniforms.repeatX.value = repeat_x;
            customMaterial.uniforms.repeatY.value = repeat_y;
            mesh.material = customMaterial;
            mesh.add(my_mirror);            
    }

Answer 1

没关系，我明白了。我不得不设置新的纹理wrapS和wrapT到repeatWrapping。

所以我所要做的就是添加以下内容： texturex.wrapS = texturex.wrapT = THREE.RepeatWrapping;

：）

更新均匀纹理后ShaderMaterial不重复

1 个答案: