Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Three.js - there is no texture bound to the unit 0 Error

Since today's Chrome update (Version 50.0.2661.86 (64-bit) OSX), my three.js based application started outputting this warning :

[.CommandBufferContext]RENDER WARNING: there is no texture bound to the unit 0

and the application is not loading anymore (it's just stuck in the loading screen).

To give a context of the strangeness of this error, we are instancing meshes with a texture + normal map, and there is a weird behaviour where : - if we load all the instances the application crashes - if we load fewer instances, the applications loads

For info, we load all the textures in the material creation callback, so the previous Stackoverflow answers giving solutions about this issue don't really work.

Does anyone have any idea of what we could change to make this work ? Or should we open a ticket to the Chromium team reporting an issue ?

It was working perfectly before today's update.

like image 962
Christian Marques Avatar asked Apr 26 '16 21:04

Christian Marques


People also ask

How do I make a 3JS texture repeat?

By default textures in three.js do not repeat. To set whether or not a texture repeats there are 2 properties, wrapS for horizontal wrapping and wrapT for vertical wrapping. Repeating is set with the [repeat] repeat property. Offseting the texture can be done by setting the offset property.

How to load a texture from an image in JavaScript?

We create a TextureLoader and then call its load method. This returns a Texture object. It's important to note that using this method our texture will be transparent until the image is loaded asynchronously by three.js at which point it will update the texture with the downloaded image.

How do I wait for a texture to load?

To wait for a texture to load the load method of the texture loader takes a callback that will be called when the texture has finished loading. Going back to our top example we can wait for the texture to load before creating our Mesh and adding it to scene like this


1 Answers

If you add:

this.image = image; // retain a reference to the object to prevent garbage collection

after line 18419 of three.js (r76), it will also correct the TextureLoader hang in the newest version of Chrome.

like image 97
M1ke Avatar answered Sep 23 '22 14:09

M1ke