Hi,
The following fiddle is a sample that reads an HDR file and creates an environment map using CubeTexture.
https://jsfiddle.net/yamasaki/yome76tz/
If you comment out line 23 and uncomment line 24, it works correctly. However, I don’t want the scene to depend on the renderer (since I want to display the same scene on multiple views), so I tried rendering the CubeTexture with a renderer that isn’t tied to the DOM.
Is what I’m trying to achieve impossible due to THREE.js’s specifications?
You won’t be able to use the same loaded HDR in multiple renderers.
It’s not really recommended to use Multiple renderers on a single page.
If you need to render different regions on a page, it’s more performant to use One renderer, and a full screen canvas, and control where each thing draws, using
renderer.setViewport and renderer.setScissor
As in this example: three.js examples
If you HAVE to use 2 renderers:
I believe you will have to load a copy for each renderer, and only use that with scenes used in that renderer.
Oh, so it’s more efficient to use a single renderer per page.
This is my first time learning about it, and it’s very informative. Thank you!