DataTexture to Uint8Array?

Questions
1

Hi - How can I access the data from a DataTexture object? I am trying to implement a QR scanner from my camera using jsQR which requires a Uint8Array data. This framebuffer example creates a DataTexture which is pretty close to what I want, but I want the added step of accessing the Uint8Array from the DataTexture object so I can feed it into jsQR. How can I do this?
Thank you

2

Try to access DataTexture.image.data.

3

Crossposting:

4

Thanks for the help Mugen87 -

This does return an array of values, the only problem is that all of the values are 0 regardless of the texture content. I tested with the framebuffer texture example which yielded the same result fiddle here to demonstrate (see console).

5

I see. It’s important to understand that each three.js texture object has an internal WebGLTexture object. Normally you update the data of this object when you load an image or setup an array buffer and then set Texture.needsUpdate to true. In the mentioned example, the WebGLTexture object is now updated directly with the content of a framebuffer. So DataTexture.image.data does not reflect the actual content of the texture. To solve this issue, you have to write some custom code with the raw WebGL context since three.js does not provide an API for this scenario:

https://jsfiddle.net/cz2gej01/20/

1 Like
6

Brilliant ! Thank you for the thorough explanation and example, makes sense and now all is working.

1 Like