I would like to ask you if you know how to repeat texture using THREE.TextureLoader(). I've found solutions just for using THREE.ImageUtils.loadTexture(). Here is part of my code:

var loader = new THREE.TextureLoader();
var wall;
loader.load('../images/concreteWall.jpg', function (texture) {
                        var wallMaterial = new THREE.MeshBasicMaterial({
                            map: texture
                        });
                        wall = new THREE.Mesh(sideWallsGeometry, wallMaterial);
                        scene.add(wall);
                    }
                );

I would like to ask you if you know how to repeat texture using THREE.TextureLoader(). I've found solutions just for using THREE.ImageUtils.loadTexture(). Here is part of my code:

var loader = new THREE.TextureLoader();
var wall;
loader.load('../images/concreteWall.jpg', function (texture) {
                        var wallMaterial = new THREE.MeshBasicMaterial({
                            map: texture
                        });
                        wall = new THREE.Mesh(sideWallsGeometry, wallMaterial);
                        scene.add(wall);
                    }
                );

• javascript
• three.js
• texture-mapping

1 Answer 1

Here is the pattern to follow if you want to repeat a texture:

var loader = new THREE.TextureLoader();

var texture = loader.load( 'path.jpg', function ( texture ) {
    texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
    texture.offset.set( 0, 0 );
    texture.repeat.set( 1, 1 );

    // your code

} );

three.js r.84