Improve WebXR Layers example #22144
Improve WebXR Layers example #22144
Conversation
* Add 4 eye charts to demonstrate the effects of mipmaps on text. * Add a GUI to demonstrate interacting with layers. * Improve info text and add more comments. * Add a preview screenshot. Tested: * Oculus Quest 2 shows layers properly. * Chrome on Windows shows error message.
|
I'm not sure how to fix the screenshot test. It's failing because the screenshotting system doesn't use layers to render the video or eye charts. I manually took a screenshot which is more informative than the automatic screenshot. Should I just use the automatic screenshot? |
| renderer.state.bindTexture( gl.TEXTURE_2D, glayer.colorTexture ); | ||
| gl.pixelStorei( gl.UNPACK_FLIP_Y_WEBGL, true ); | ||
| const canvas = guiMesh.material.map.image; | ||
| gl.texSubImage2D( gl.TEXTURE_2D, 0, 0, 0, canvas.width, canvas.height, gl.RGBA, gl.UNSIGNED_BYTE, canvas ); |
There was a problem hiding this comment.
Sorry but I think all of this overcomplicates the example. We should try to keep it as simple as possible (that includes no WebGL API calls in the example code).
Related: #10269 (comment)
There was a problem hiding this comment.
Would it be clearer if I pulled the boilerplate code into a utility library at examples/jsm/webxr/layers.js? There is no way to demonstrate text rendering to layers without the gl.texSubImage2D call. And one of the major use cases of layers is for high quality text and 2D UI rendering.
There was a problem hiding this comment.
Would it be clearer if I pulled the boilerplate code into a utility library at examples/jsm/webxr/layers.js?
That sounds like a step in the right direction. Ideally the code becomes some sort of reusable component.
|
I agree that it over complicates the example, but I think it's better than the current example. |
|
However, we should definitely make an abstraction of all this code in |
|
I'm still working on trying to cleanly abstract the layer code into a separate file. I'm working on my own layer utility, but it's too complex to add into the examples. Once I'm satisfied with the design of my utility lib, I'll extract the minimal bits and create a new PR to update this example. |
Improve WebXR Layers example.
Tested: