Textures and Web GL errors.

[srimshady]

So when I run my game sometimes it works fine, and sometimes I'm getting these errors: 

 

WebGL: INVALID_OPERATION: texParameter: no texture bound to GL_TEXTURE_2D

WebGL: INVALID_OPERATION: generateMipmap: no texture bound to GL_TEXTURE_2D

 

WebGL: drawElements: texture bound to texture unit 0 is not renderable. It maybe non-power-of-2 and have incompatible texture filtering or is not 'texture complete'. Or the texture is Float or Half Float type with linear filtering while OES_float_linear or OES_half_float_linear extension is not enabled. (this last one one is happening every frame).

 

First of all, I'm using png's for my textures. Also, I didn't think you needed power of 2 textures for web gl, but I made them that just incase and I'm still getting the error. I'm using assetmanager.

[GameMonetize]

hello can you try to reproduce it in the PG?

[BitOfGold]

Do you use custom procedural textures?

I got many errors like this, when tried to render a mesh with a material with a C.P.T. on it (when the generating shader was not loaded/compiled yet...)

It took many hours (days?  ) to find this.

[srimshady]

Do you use custom procedural textures?

I got many errors like this, when tried to render a mesh with a material with a C.P.T. on it (when the generating shader was not loaded/compiled yet...)

It took many hours (days?  ) to find this.

No just straight pngs.

[srimshady]

hello can you try to reproduce it in the PG?

I can't reproduce the error. I can post my code if you would like? Have you never seen this before?

[MarianG]

Hi, srimshady.

 

There is no errors, only attentions ) .... because it's recomanded to use power of 2 images.

And below it's the more complex answer from another topic about textures.

More exactly from

 http://www.html5gamedevs.com/topic/15785-how-optimize-image-texture/

 

As referenced already in this post, I find the best and most efficient results using .jpg image files for images 24 bits or less (8 bits for each red, green, and blue channel), and .png files for 32 bit images (the extra 8 bits used for a greyscale alpha channel.)  Targa image files and other formats are fine, however, they generally use more memory on disk (not necessarily graphics memory) - but more disk space on the server and locally as they are lossless and uncompressed image formats.

 

It was also asked if power of 2 images are best to use.  The answer is yes.  Power of 2 images are essential.  And, it's best to use 8 X 8 blocks as .jpg images and other formats are encoded in 8 X 8 blocks.  So it may use a bit more memory, but your scene will render faster using 8 X 8 block textures such as 16 X 16, 32 X 32, 64 X 64, 128 X 128, etc.  Also, the frame buffer is composed of fragments which are square, which is why power of 2 textures are essential.  Otherwise, textures other than power of 2 on Android and other devices will render as white.

 

[GameMonetize]

Can you share a link to your webpage?

[MarianG]

Unfortunatelly I can't yet, but here is a console with last babylonjs.max.

 

http://prntscr.com/9hjcnv

 

I use 900x900 jpg images

[GameMonetize]

and what about your code?

[dbawel]

Hi shrimshady,

 

Welcome to the forum,

 

As "bulisor" was kind to reference from a previous post, the info in the quote are some of the general parameters you may wish to follow. Provided that your scene functions correctly without any operational or other peformance errors, then there is no need to currently worry about the "WebGL: INVALID_OPERATION: texParameter: no texture bound to GL_TEXTURE_2D", (or the similar generateMipmap error), as I commonly see this error reported more than any other console errors in my scenes. This does not mean that you should completely ignore this error in the long run, but it is fairly generic and is generally created by a vertex attribute on your mesh. Again, if this is an error reported without any affect on the performance or functions in your scene, continue working to complete your scene; and just live with it for now, as I've found no solution to cause this to not report. It is an error that is associated with the Babylon master file - but not a problem with the master file, as this is a conflict with WebGL itself. Just do your best to follow the "rules" of using power of 2 textures, and you will most likely have no operational problems with having this error reported, and in this case, I am in the habit of using a texture either 1024 X 1024 or 512 X 512, and not 900 X 900 - as I find the least use of resorces and memory using .png files of power of 2 and 8bit divisible image files - which I only began using .png files when I moved to babylon,js. And these resolutions will provide you with the best rendering display on mobile devices specifically.

 

Changing the texture resolution will not cause the console error you are reporting to go away, but this will eliminate one possibility which is a step in the right direction - and generally important to the precision of the display of your textures on mobile devices - as WebGL uses lower precision processing to make the most of the limited CPU resources available on mobile devices currently available today. 

 

What I can tell you without providing an explanation which wont assist you at all, is not to worry, as there is nothing you can do to keep this from reporting in many scenes, and when you do see this console error, you should generate your textures using all of the best scenarios for texture creation (which I recommend regardless) to render the very best results on mobile devvices - even though the error reports on desktops and laptops. If you want to learn more specifics about these and similar errors, there are resources avalable online which will provide more thorough info as to why these errors are generated. However, I'm simply providing a very simplistic answer to your question, as there is little or nothing most users will be able to do - short of writing and changing operations within the WebGL standard - which I certainly have absolutely no idea where to begin, and this should hopefully tell you what you need or want to know to continue to move forward without any real worries - currently.

 

DB

[MasterK]

in prepareWebGLTexture func,

the onLoad func was before finish prepareWebGLTexture.

so make the error, the texture is some large.

should move the onLoad func to last of prepareWebGLTexture.

[GameMonetize]

Correct! I'll have it fixed

[ozRocker]

Is anyone else still having problems here or is it just me?

In prepareWebGLTexture I get webGL errors with the lines:

        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, filters.mag);
        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, filters.min);

and

gl.generateMipmap(gl.TEXTURE_2D);

They are "no texture bound to target" errors.  This doesn't happen all the time, maybe 90%, but everything still looks rendered properly.  The error seems to be complaining about the texture not loaded yet.  Its as if one of the functions preceding that command is an asynchronous function and hasn't completed yet.

I'm using Babylon.2.5-alpha

[MasterSplinter]

That's a generic webgl error.  You may have a race condition where your texture isn't ready.  Maybe uses promise if you want to get rid of that error.  

[MasterSplinter]

@dbawel you see webgl 2.0 does away with the non power of two stuff

[ozRocker]

I'm using power of twos in my demo.

There's definitely a race condition going on but I'm trying to determine if its with Babylon.js or HTML.  When I trace up the call-tree I can see that prepareWebGLTexture is only ever called in the onload callback of a standard Image() element so the texture should be fully loaded by then, unless there's a bug with HTML

[ozRocker]

ahh, I'm an idiot!  I was looking at the wrong place.  I have a particle effect when a player arrives in the scene to make it look like they teleported into the world.  Because they happen at the same time I thought the problem was with the player texture.  The problem is actually with loading the texture for the particles.  So I shoved the particle code in the onLoad callback of the particle texture and I only load that texture once and keep it around instead of reloading it every time.  I now have ZERO webGL errors in my console!  

[dbawel]

@MasterSplinter - I've looked fairly closely at the features of WebGL 2.0, and there is certainly progress in the support of non PWR of 2 images - however, in V2.0 it is very easy to get into trouble not using PWR of 2 image files as support is VERY limited to specific usages, and supported less than more. So if you are loading your image files into an array, and using these for GUI elements or textures in general, everything appears to be fine. However, I'm not yet familiar enough with the usage to map out precisely all that is supported and what all is not - which quite allot of image functions and usage is not yet supported. 

There are clear instances where you will have issues in HTML, and also often require additional code to resize to the "next" or "nearest" PWR of 2 image size - which is not something I often want to spend the time to do. Also there are many shaders that won't yet support non PWR of 2 image files - and specifically if you are repeating your texture in any way, you must use PWR of 2 image files. And there is not yet any 3D texture support - and I don't believe float64 (native WebGL float) is supported for image arrays in loading non PWR of 2 - so for now I only take advantage of this for GUI elements, and make sure I'm using PWR of 2 for any scene textures and other image functions. Although this already comes in very valuable for image usage in functions requiring very odd aspect ratios such as a texture I'm currently using to create a slider which is an image measuring 400px X 10px - which would be impracticle as I would have to use the next PWR of 2 resolution which would be a 512 X 512 image file requiring many lines of code to simply draw this at the required 400 X 10 resolution my GUI requires.

It's quite possible that we will most likely forget all about PWR of 2 image files in 2 -3 years in most frameworks and renderers, and I will certainly take the time to thank the Gods for such functionality - providing this doesn't chip away at our memory and GC. However for right now, I would personally advise any developer to avoid image files other than PWR of 2 yet at this time - as it's far too easy to get into trouble until WebGL and most all applications in general begin to standardize the handling of major and minor GC in browsers - as well as what should already be simple GC management for most OS applications.

Thank you for bringing this to the attention of the community, as there are agressive inroads being made in memory management overall. And @ozRocker - congratulations on your Punkoffice World - as it is already looking awesome, and in the future can only improve. It's fun to fly around now, and the chat works well and remains in memory when closed. We're all having way too much fun for what might be considered work. Unless of course you're building apps (not games) in WebGL such as I - which I am rediculous enough to be working on apps for professionals - and especially no fun since almost ALL of my personal experience is in 3D animation and mocap.

Cheers,

DB

[Nabroski]

someone had code for copy +paste ? 

thank you

[dbawel]

@Nabroski-

45 minutes ago, Nabroski said:

someone had code for copy +paste ? 

Can you make the question more clear? I don't understand what you might be asking.

Cheers,

DB

[Nabroski]

WebGl Texture is not bound of two, - a quick fix.

[Nabroski]

I spend today 6hours of converting a video, with 3 different programs and ffmpeg,
Going trough trial and error, and its still don't working.

It should be somewhere a documentation on this, what exactly, i have to do, to get a video right away after converting.

[dbawel]

3 minutes ago, Nabroski said:

WebGl Texture is not bound of two, - a quick fix.

I'm so sorry - I still don't understand. If there is not a question you need answered, then don't waste your time trying to help me to understand. But if you have a quaestion, I will try and answer if I can make my brain follow the question.

DB

[dbawel]

@Nabroski - As I mentioned above, there is a bug in v2.4 of the baylon.js master. Use version 2.2 of babylon.js and your videoTexture should work. If you still have a problem after this, then let me know and I can provide clear steps to making any videoTexture work. But I'm pretty sure that switching back to version 2.2 will make your videoTextures work fine.

DB

[Nabroski]

@dbawel

Hello

sorry had a long day.

Here, nothing to do with Video.
https://ea5d4c70e420125a53aadf6589a5a42adabf753f.googledrive.com/host/0BwTQLXGKzDbZNU9YMTU4ZzFuem8/


Please - Open your console, its kind of the most common error i get on with VIDEOtexures
[.CommandBufferContext.Offscreen-MainThread-03F4CF50]RENDER WARNING: there is no texture bound to the unit 0

I start  google for this, and the only quick solution, i find on the web is, to override the some gl Handling functions from Babylonjs.

Thank you

Best
Alexander