I am trying to render multiple views of a scene. Some views use an Orthographic camera and wireframe. I’ve set autoClear, autoClearColor, autoClearDepth and autoClearStencil to false. The only way I have been able to get this working is to trick the renderer into thinking each camera is an ArrayCame…

I added renderer.setClearColor(col, 1); renderer.clearColor(); Outside the forEach. Working fine now. But is this the best way to control multiple views?

I use several containers with separate cameras and renderers. See from the Collection of examples from discourse.threejs.org : ConstructionBasis and Construction of frames with contour/profile In another project with several containers [2023-11-10 09.58.33] const containerA = document.query…

Nice idea. Multiple renderers is probably the best solution.

You can also render the wireframe with a camera (and a single renderer) by using the mesh’s onBeforeRender and onAfterRender, setting a ‘wireframe’ name to the camera. camera.name = 'wireframe'; mesh.onBeforeRender = (renderer, scene, camera) => { if (camera.name === 'wireframe') { mesh.mate…

imo multiple renderers are slow, you can’t share data, everything gets double tripple quadruple loaded, it’s a massive memory sink hole, the browser has an arbitrary limit for canvas context and if that’s reached it ends the tab. the clean solution is gl.skissor, cutting one canvas into fragments, b…

[image] drcmda: multiple renderers are slow It certainly depends on the use case. I have not tested this in comparison to other solutions. It depends on the application. There are no problems with my construction grids. The user himself is the slowest when clicking and dragging the markers. …

it’s generally not a good idea, the simplest reason is that the browser will kill your app, and there will be overhead and double loading because some (most? …) assets are tied to their render instance, three cache et al. with gl.skissor/setViewport you can re-use everything, environments, textures,…

Don’t use multiple renderers if you can avoid it. They can’t easily share data and GL contexts are pretty heavyweight. You want to use renderer.setViewport for this… https://threejs.org/docs/#api/en/renderers/WebGLRenderer.setViewport . https://threejs.org/examples/webgl_multiple_views.html

I came to my construction step by step (see my first post here) through the following things. Compare three.js scenes with overlay slider The now missing codepen @looeee is available as a copy in the collection . See scene comparison . At the time, @Mugen87 thought it was cool. It may be that so…

I didn’t think setViewport was working. But I removed * window.devicePixelRatio and all was well.

Render multiple views

Questions

hofk November 14, 2023, 8:50am 15

Very interesting.

You use controls and UI elements in fixed positions.
Can these also be linked to individual areas at the bottom as I need them to be? (see my posts above)

Topic		Replies	Views
Show 2 viewport using same renderer Questions webgl-renderer	3	1377	November 3, 2020
Sync cameras within different canvas Questions camera	5	1614	October 8, 2023
How to render different objects from a scene through different cameras Questions camera , layers	1	1289	July 4, 2018
Trouble with animations exported from blender in multiple renderers Questions webgl-renderer , multiple-views	2	510	June 26, 2022
Adding multiple canvas to single webgl renderer Questions webgl-renderer , canvas	3	7334	July 27, 2022

Render multiple views

Related topics