Three.js: WebGLRenderTarget.texture ignores wrapS and wrapT when used as material map

Created on 9 Mar 2017  路  2Comments  路  Source: mrdoob/three.js

I am trying to make the texture produced by a WebGLRenderTarget the map of a material used in a plane. We have a function that returns us a WebGLRenderTarget.texture, and it works well until we try to set texture.repeat to any value other than (1, 1).

    function GenerateTexture() {
        // ... some code ...
        renderer.render(bufferScene, bufferCamera, bufferTarget);
        console.log("width: " + bufferTarget.width + ", height: " + bufferTarget.height);

        return bufferTarget.texture;
    }

    // ... some code ...

    var texture = GenerateTexture();
    texture.wrapS = THREE.RepeatWrapping;
    texture.wrapT = THREE.RepeatWrapping;
    texture.repeat.set(8, 8);

This snippet generates a texture that gets bound to one of the corners of our plane, then gets stretched out in the vertical and horizontal axis, like you would expect from a texture that didn't get its wrap fields correctly set to RepeatWrapping while having a custom repeat value. It also logs "width: 2048, height: 2048", as intended, so I know the framebuffer (and, by extension, I assume the texture as well) is a power of 2.

I tried to change var texture = GenerateTexture(); to var texture = new THREE.TextureLoader().load("some/image.jpg");, and it worked exactly as intended, by wrapping itself all accross the plane, so I know our plane and our wrapping setup are correct.

It seems the texture in WebGLRenderTarget.texture ignores wrapS and wrapT for whatever reason, but it appears to be a bug with the library. Can anyone confirm the problem?

Three.js version
  • [ ] Dev
  • [x] r84
  • [ ] ...
Browser
  • [x] All of them
  • [ ] Chrome
  • [ ] Firefox
  • [ ] Internet Explorer

Most helpful comment

@IRMN You need to set the wrapping mode prior to rendering to the texture.

All 2 comments

I think you need to set the wrapping mode in the contructor:

var bufferTarget = new THREE.WebGLRenderTarget(2048, 2048, { wrapS: THREE.RepeatWrapping, wrapT: THREE.RepeatWrapping});

@IRMN You need to set the wrapping mode prior to rendering to the texture.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

konijn picture konijn  路  3Comments

ghost picture ghost  路  3Comments

yqrashawn picture yqrashawn  路  3Comments

filharvey picture filharvey  路  3Comments

jlaquinte picture jlaquinte  路  3Comments