@graphty/graphty-element / index / RenderManager
Class: RenderManager ​
Defined in: graphty-element/src/managers/RenderManager.ts:195
Manages Babylon.js scene, engine, and render loop
Implements ​
Constructors ​
Constructor ​
new RenderManager(
canvas,eventManager,config?):RenderManager
Defined in: graphty-element/src/managers/RenderManager.ts:230
Creates a new render manager for Babylon.js scene and rendering
Parameters ​
canvas ​
HTMLCanvasElement
HTML canvas element for rendering
eventManager ​
Event manager for emitting render events
config? ​
RenderManagerConfig = {}
Optional render configuration
Returns ​
RenderManager
Properties ​
camera ​
camera:
CameraManager
Defined in: graphty-element/src/managers/RenderManager.ts:198
engine ​
engine:
Engine|WebGPUEngine
Defined in: graphty-element/src/managers/RenderManager.ts:196
graphRoot ​
graphRoot:
TransformNode
Defined in: graphty-element/src/managers/RenderManager.ts:199
scene ​
scene:
Scene
Defined in: graphty-element/src/managers/RenderManager.ts:197
Methods ​
applyBackground() ​
applyBackground(
background,onSkyboxLoaded):void
Defined in: graphty-element/src/managers/RenderManager.ts:480
Draw the graph against a background: a clear colour, or a photo-dome skybox.
The scene holds at most one dome. A colour disposes it; a different skybox replaces it; the skybox already shown is left alone, so drawing the same background again (a redo, a repeat) builds nothing.
Parameters ​
background ​
{ backgroundType: "color"; color: string | undefined; } | { backgroundType: "skybox"; data: string; }
The background, parsed.
onSkyboxLoaded ​
(url) => void
Called with the image once a new skybox's texture has arrived.
Returns ​
void
dispose() ​
dispose():
void
Defined in: graphty-element/src/managers/RenderManager.ts:310
Dispose the render manager and clean up resources
Returns ​
void
Implementation of ​
getRenderStats() ​
getRenderStats():
object
Defined in: graphty-element/src/managers/RenderManager.ts:522
Get current render statistics
Returns ​
object
Current FPS and active mesh count
activeMeshes ​
activeMeshes:
number
fps ​
fps:
number
holdFrames() ​
holdFrames(): () =>
void
Defined in: graphty-element/src/managers/RenderManager.ts:457
Keeps the render loop from drawing until the returned function is called.
A FRAME IS WHAT A GPU READBACK WAITS BEHIND. Drawing a scene of thousands of meshes keeps the main thread for tens to hundreds of milliseconds, and a promise the GPU resolves -- the mapped buffer at the end of a traversal, the frontier count between its levels -- is delivered as a task, which cannot run until the frame that was drawing has finished. A breadth-first search that costs 7 ms on the device came back after 225 ms through the element at 1,000 nodes and after 8.6 s at 10,000, two frames per readback (issue #390). Measured apart, the CPU update of a frame is 2.5 ms and is not what the readback waits on; the draw is 48 ms at 1,000 nodes and is.
So a call-shaped accelerated run holds the frames for as long as it is on the device, and the picture stands still for those milliseconds instead of the run stretching to seconds. Holds nest: the frames resume when the last holder releases, and releasing twice is a no-op, so a finally cannot over-release.
Returns ​
Releases this hold.
() => void
init() ​
init():
Promise<void>
Defined in: graphty-element/src/managers/RenderManager.ts:287
Initialize the render manager and Babylon.js engine
Returns ​
Promise<void>
Implementation of ​
startRenderLoop() ​
startRenderLoop(
updateCallback):void
Defined in: graphty-element/src/managers/RenderManager.ts:332
Start the render loop with the provided update callback
Parameters ​
updateCallback ​
(frameMs) => void
Function to call before each render frame, given how long the frame before it took in milliseconds (0 on the first)
Returns ​
void
stopRenderLoop() ​
stopRenderLoop():
void
Defined in: graphty-element/src/managers/RenderManager.ts:429
Stop the render loop
Returns ​
void