WebGL: INVALID_OPERATION: texSubImage3D: no texture bound to target

Hello, I have created a Data3dtexture and trying to load data to it, but I’m getting
WebGL: INVALID_OPERATION: texSubImage3D: no texture bound to target
why do I getting this warning? and How to solve this?

let width = 1024;
let height = 1024;
let depth = 32;
let rgbVolumeTexture = new THREE.Data3DTexture( null, width, height, depth);
rgbVolumeTexture.format = THREE.RGBFormat;

let imgSlice = 4;
let numDataCount = 8 // number of unit8array data I have
// rgb_data[i]  is new Uint8Array(width * height * imgSlice * 3);
// each images will have a width & height of (1024, 4096)
// I have 8 images with 4 slices in each images so the depth will become 8*4 = 32 
for (let i = 0; i < numDataCount; i++) {
  const rgbTextureProperties = xr_renderer["properties"].get(rgbVolumeTexture);
  let oldTexture = gl.getParameter(gl.TEXTURE_BINDING_3D);
  gl.bindTexture(gl.TEXTURE_3D, rgbTextureProperties["__webglTexture"]);
        gl.texSubImage3D(
          gl.TEXTURE_3D,
          0,
          0,
          0,
          i * imgSlice,
          width,
          height,
          imgSlice,
          gl.RGB,
          gl.UNSIGNED_BYTE,
          rgb_data[i]
        );

  gl.bindTexture(gl.TEXTURE_3D, oldTexture);
}

Why are you working with the raw WebGL context?

The engine does actually not support this kind of app level logic. I recommend you use 3D textures like promoted in the official example: three.js webgl - volume rendering example

1 Like