CODEWITHSUNDEEP
three.js
kbar
kbar

Reputation: 77

Threejs: repeating texture inside of load for a single canvas render

I am rendering a sphere using a threejs lib for react "import * as THREE from 'three';".

The sphere renders fine, as does the texture.

I have an image that's being loaded just fine, and it wraps the entirety of the sphere.

The question: how can I repeat the image across the sphere? In my specific example, imagine I have an image of half a face. Per hemisphere, I would like to mirror that image, so that I would have two symmetrical faces on each side of the sphere, looking outwards. Brand new to threejs, any help is appreciated!

Upvotes: 0

Views: 256

Answers (1)

2pha
2pha

Reputation: 10155

Maybe set repeat on the Texture.
eg. 

// load a texture, set wrap mode to repeat
var texture = new THREE.TextureLoader().load( "textures/water.jpg" );
texture.wrapS = THREE.RepeatWrapping;
texture.wrapT = THREE.RepeatWrapping;
texture.repeat.set( 4, 4 );

Upvotes: 1

Related Questions