Повторите текстуру с помощью ShaderMaterials в three.js

Question

У меня проблема с однородными текстурами и их повторением, потому что с:

tex.wrapS = THREE.RepeatWrapping;
tex.wrapT = THREE.RepeatWrapping;
tex.repeat.x=100;
tex.repeat.y=100;

это не работает Поэтому я искал в Интернете решение и обнаружил следующую ветку на giuthub: https://github.com/mrdoob/three.js/issues/787 Автор темы имеет ту же проблему, что и я, но, к сожалению, ссылки с ответы больше не работают.

Что мне делать, если я хочу, чтобы мои однородные текстуры повторялись?

Answer 1

Вы пишете свой собственный фрагментный шейдер? Если это так, вам нужно умножить координаты UV на значения повторения, например

uniform sampler2D baseTexture;
varying vec2 vUv;

void main() 
{
    gl_FragColor = texture2D( baseTexture, vUv * 100 );     
}

Если нет, http://stemkoski.github.io/Three.js/Texture-Repeat.html содержит пример повторения текстуры, например

// texture repeated twice in each direction
var lavaTexture = THREE.ImageUtils.loadTexture( 'images/lava.jpg' );
lavaTexture.wrapS = lavaTexture.wrapT = THREE.RepeatWrapping;
lavaTexture.repeat.set( 2, 2 );
var lavaMaterial = new THREE.MeshBasicMaterial( { map: lavaTexture } );