A render target in three.js is basicaly a texture you can render to. After you render to it you can use that texture like any other texture. Let's make a simple example. We'll start with an example from the article on responsiveness. Rendering to a render target just almost exactly the same as normal rendering. First we create a WebGLRenderTarget.
I'm trying to create a three.js cube with different textures on each face.
Basically a dice. This is in my sandbox environment, so should just product a rotating cube with dice images (1-6) on each side. Once done I intend to use this for a browser base game. This example I have only tested in Chrome, although contemplating changing it to a canvas renderer for additional browser support.
Had a look at a few questions here on SO and a substantial amount of other googling, and though I had the answer (seemed reasonably simple actually) but I simply cannot get it to work.
I am reasonably new to three.js, but not JavaScript.
Pages I used for reference are
and enriquemorenotent.com - three.js building a cube with different materials on each face
My Code
The error I am getting is
from three.js line 19546 (not the min version) WHichi is the bufferGuessUVType(material) function - material is undefined. Which leads me to believe something is not right in one/all of my material definitions.
Using three.js r58.
![Three js cube texture loader Three js cube texture loader](/uploads/1/2/5/0/125018901/287541938.jpg)
There is really no HTML or CSS, just the JS at this point
I can quite happily get a cube rotating with the same image on all six sides but not with different images. The images are just the images of a dice dots, 1 - 6.
Given a bit more time I could do a fiddle if required
sohnryang57411 gold badge1111 silver badges2424 bronze badges
OJayOJay4,03922 gold badges1818 silver badges3535 bronze badges
1 Answer
EDIT:
THREE.MultiMaterial
has been deprecated. You can now pass the materials array directly into the constructor. Like so:Be careful of copying old examples from the net.
Always check the Migration Wiki for help upgrading to the current version.
three.js r.85
WestLangleyWestLangley80.3k88 gold badges185185 silver badges202202 bronze badges