hello. i would like to send an image [on a mesh] in 3D to an html5 export. what i have tried so far has resulted in black screens. so, in Blender, import image as plane [i note that planes are regarded as problematic in Godot but i am trying to keep it simple] export as .obj and import to Godot. set scene with a camera and a light, export to html5 from Godot.
but this is not working.
so how can i get it to work?
thanks
i'm using a local webserver to display the html [127.0.0.1] other files are displaying fine from this server.
Are you trying to send an image to an already exported Godot HTML project? I don’t know if it is possible to load image files at runtime with the HTML export, but if it is possible, this page on the documentation might help. I have also written a proof-of-concept Godot plugin that can load resources while a game is running, though I have no idea if it works with HTML exports.
If you are just trying to display an image on a plane, then I think Godot should be able to show an image on plane on a HTML exported project. I do not know how Godot’s 3D abilities are with HTML, but I’ve exported some 2D projects without any issues.
If you export to HTML with debug enabled, do you get any errors on the Godot debug console and/or the web browser console?
One thing that could be causing the black screen issue is WebGL compatibility with your browser. Projects exported with OpenGL 3 require WebGL 2 compatible browsers, while OpenGL 2 projects require WebGL 1 compatible browsers.
Hopefully this helps! (Side note: Welcome to the forums!)
thanks TwistedTwigleg i will review all of that.
html export to 2d is indeed good but trying to do similar in 3d is the problem. maybe its the WebGL compatibility problem so i will look down that dark path.
models.js:7 OpenGL ES 3.0 Renderer: WebKit WebGL models.js:7 ERROR: Texuture 'res://.import/po2.png-f1789ecf8485a22bcf8bd656a9c290b1.s3tc.stex' is compressed, has mipmaps but is not of powerf-of-2 size. This does not work on OpenGL ES 3.0. put_char @ models.js:7 models.js:7 At: drivers/gles3/rasterizer_storage_gles3.cpp:757:texture_set_data() - Texuture 'res://.import/po2.png-f1789ecf8485a22bcf8bd656a9c290b1.s3tc.stex' is compressed, has mipmaps but is not of powerf-of-2 size. This does not work on OpenGL ES 3.0. put_char @ models.js:7 4models.html:1 [.WebGL-000001F433B94050] GL_INVALID_OPERATION: Invalid compressed image size. models.html:1 [.WebGL-000001F433B94050] GL_INVALID_OPERATION: It is undefined behaviour to have a used but unbound uniform buffer.
this seems like a look for a purple squirell more learning needed.
aha! it seems to be a power of 2 image thing. a model with a 512x512 texture exports to html5 and displays in the browser. the docs at Importing textures talks about this briefly and also discusses the 'Detect 3D' checkbox "settings are changed so the texture flags are friendlier to 3D (mipmaps, filter and repeat become enabled and compression is changed to VRAM)" but this does not happen for image.
Ah, that makes sense. I totally forgot the power of 2 size requirements. Normally I use textures/images with a power of 2 without thinking about it, a habit formed by having issues like this in many different engines/frameworks.
Does it work now?
yes it does, as i described but the 'Detect 3D' checkbox does not give the docs described behaviour but not to worry from now on - power of 2 images :-)
