THREE.js repetem a textura de quebra automática no shader

Eu quero repetir a textura de quebra automática no THREE.js shader.

A imagem original da textura é:

Eu quero repetir 4x4 vezes que se parece com:

Mas com o seguinte código, acaba por ser:

Shader de vértice:

varying vec2 vUv;

uniform float textRepeat;

void main()
{    
    // passing texture to fragment shader
    vUv = uv * textRepeat;

    gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
}

Fragment shader:

varying vec2 vUv;

uniform sampler2D texture;

void main() {
    // add origianl texture
    gl_FragColor = texture2D(texture, vUv);
}

uniforms em um arquivo JavaScript, em quetextureRepeat dá os tempos precisam ser repetidos:

uniforms: {
    texture: {
        type: 't', 
        value: THREE.ImageUtils.loadTexture('image/box.jpg')
    },
    textRepeat: {
        type: 'f',
        value: 8
    }
}

Alguém poderia me dizer o que está errado aqui?

questionAnswers(2)

yourAnswerToTheQuestion