GL_INVALID_VALUE: Offset overflows texture dimensions

Questions
1

Hi everyone,
Something weird happened with my code… It was working perfectly 2 weeks ago and then I decided to reopen the project and I have this error with textures dimensions and image incomplete… any idea where it could come from?

The two errors:

[.WebGL-0x4c020e4000] GL_INVALID_VALUE: Offset overflows texture dimensions.
THREE.WebGLRenderer: Texture marked for update but image is incomplete
2

Do you mind demonstrating the issue with a live example?

3

I’m not really good at creating codepen, but I have a live example here:
https://relaxed-blackwell-9ca9f5.netlify.app/
( It’s a build with parcel, the shaders files are minified, but you can find my code in the app.js file)

4

The following code could be the problem:

var texture = new THREE.Texture(img);
img.onload = function () {
     texture.needsUpdate = true;
};

texture.needsUpdate = true;

Immediately setting Texture.needsUpdate to true is not valid in this case. You have to do it in the onload callback. So just use:

var texture = new THREE.Texture(img);
img.onload = function () {
     texture.needsUpdate = true;
};
5

My mistake, I added the onload callback trying to fix my problem and forget to remove the other one.
Still not working… :face_with_diagonal_mouth:

Ok I have been doing some digging, it seems there is a problem since the 0.135.0 update. Before this update, everything works perfectly. I found this commit that may explained the problem, but I’m not sure I understand it : WebGLTexture: Basic support for gl.texStorage2D(). #22790

7

Starting from r135 it’s important that you don’t resize a texture. After the initial use, its dimensions are fixed. I could imagine that you have this kind of problematic logic in your app.

It would be great if you could isolate the issue into a small, editable live example like a fiddle: Edit fiddle - JSFiddle - Code Playground

8

Ok I think I have something working Img Texture - JSFiddle - Code Playground

9

Do it like so for now: Img Texture - JSFiddle - Code Playground

You are running into the following issue:

You potentially have to update your GLSL since the shader always uses the natural dimensions of your texture. Not the dimensions defined via CSS.

1 Like
10

thanks, seems to work this way :wink: