Search code examples
three.jswebgl23d-texture

3D texture array data format three.js

I'm exploring using 3d textures for video playback in three.js.

Three.js has a good example of this – https://threejs.org/examples/webgl2_rendertarget_texture2darray.html, but the data format isn't documented. I'm guessing each video frame is packed into the binary file in order as Uint8ClampedArray, but am looking for documentation on the format before trying that.

Solution

  • Your assumption is correct. The asset is no real texture format. It's just raw data which are loaded and packed into an array of data textures. Unfortunately, there is no documentation that explain how you produces such an asset. But essentially, the loaded array buffer is just a sequence of frames. So if you have a video, you can extract the data frame by frame and save the data in an array buffer. You just have to make sure to figure out the dimensions of each frame as well as the format/type of the texels (e.g. RGBA and unsigned byte).