Class: RenderingEngine
A RenderingEngine takes care of the full pipeline of creating viewports and rendering them on a large offscreen canvas and transmitting this data back to the screen. This allows us to leverage the power of vtk.js whilst only using one WebGL context for the processing, and allowing us to share texture memory across on-screen viewports that show the same data.
Instantiating a rendering engine:
const renderingEngine = new RenderingEngine('pet-ct-rendering-engine');
There are various ways you can trigger a render on viewports. The simplest is to call render()
on the rendering engine; however, it will trigger a render on all viewports. A more efficient
way to do this is to call renderViewports([viewportId]) on the rendering engine to
trigger a render on a specific viewport(s). Each viewport also has a .render method which can be used to trigger a render on that
viewport.
RenderingEngine checks for WebGL context availability to determine if GPU rendering is possible. If a WebGL context is not available, RenderingEngine will fall back to CPU rendering for StackViewports. However, for volume rendering, GPU availability is required, and an error will be thrown if attempted without GPU support.
By default, RenderingEngine will use the vtk.js-enabled pipeline for rendering viewports. However, if a custom rendering pipeline is specified by a custom viewport, it will be used instead. We use this custom pipeline to render a StackViewport on CPU using the Cornerstone legacy CPU rendering pipeline.
Constructors
new RenderingEngine()
new RenderingEngine(
id?):RenderingEngine
Parameters
• id?: string
Returns
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:89
Properties
hasBeenDestroyed
hasBeenDestroyed:
boolean
A flag which tells if the renderingEngine has been destroyed or not
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:76
id
readonlyid:string
Unique identifier for renderingEngine
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:74
offScreenCanvasContainer
readonlyoffScreenCanvasContainer:HTMLDivElement
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:79
offscreenMultiRenderWindow
offscreenMultiRenderWindow:
any
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:78
Methods
_debugRender()
_debugRender():
void
Returns
void
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:1362
_downloadOffScreenCanvas()
_downloadOffScreenCanvas():
void
Returns
void
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:1356
destroy()
destroy():
void
destroy the rendering engine. It will remove all the viewports and, if the rendering engine is using the GPU, it will also destroy the GPU resources.
Returns
void
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:475
disableElement()
disableElement(
viewportId):void
Disables the requested viewportId from the rendering engine:
- It removes the viewport from the the list of viewports
- remove the renderer from the offScreen render window if using vtk.js driven rendering pipeline
- resetting the viewport to remove the canvas attributes and canvas data
- resize the offScreen appropriately (if using vtk.js driven rendering pipeline)
fires Events.ELEMENT_ENABLED
Parameters
• viewportId: string
viewport Id
Returns
void
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:197
enableElement()
enableElement(
viewportInputEntry):void
Enables the requested viewport and add it to the viewports. It will properly create the Stack viewport or Volume viewport:
- Checks if the viewport is defined already, if yes, remove it first
- Checks if the viewport is using a custom rendering pipeline, if no, it calculates a new offscreen canvas with the new requested viewport
- Adds the viewport
renderingEngine.enableElement({
viewportId: viewportId,
type: ViewportType.ORTHOGRAPHIC,
element,
defaultOptions: {
orientation: Enums.OrientationAxis.AXIAL,
background: [1, 0, 1],
},
})
fires Events.ELEMENT_ENABLED
Parameters
• viewportInputEntry: PublicViewportInput
viewport specifications
Returns
void
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:140
fillCanvasWithBackgroundColor()
fillCanvasWithBackgroundColor(
canvas,backgroundColor):void
Fill the canvas with the background color
Parameters
• canvas: HTMLCanvasElement
The canvas element to draw on.
• backgroundColor: [number, number, number]
An array of three numbers between 0 and 1 that specify the red, green, and blue values of the background color.
Returns
void
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:506
getStackViewport()
getStackViewport(
viewportId):IStackViewport
Retrieves a stack viewport by its ID. used just for type safety
Parameters
• viewportId: string
The ID of the viewport to retrieve.
Returns
The stack viewport with the specified ID.
Throws
Error if the viewport with the given ID does not exist or is not a StackViewport.
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:377
getStackViewports()
getStackViewports():
IStackViewport[]
Filters all the available viewports and return the stack viewports
Returns
stack viewports registered on the rendering Engine
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:397
getViewport()
getViewport(
viewportId):Viewport
Returns the viewport by Id
Parameters
• viewportId: string
Returns
viewport
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:355
getViewports()
getViewports():
Viewport[]
getViewports Returns an array of all Viewports on the RenderingEngine instance.
Returns
Viewport[]
Array of viewports
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:364
getVolumeViewports()
getVolumeViewports():
VolumeViewport[]
Return all the viewports that are volume viewports
Returns
An array of VolumeViewport objects.
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:410
render()
render():
void
Renders all viewports on the next animation frame.
fires Events.IMAGE_RENDERED
Returns
void
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:429
renderFrameOfReference()
renderFrameOfReference(
FrameOfReferenceUID):void
Renders any viewports viewing the given Frame Of Reference.
Parameters
• FrameOfReferenceUID: string
The unique identifier of the Frame Of Reference.
Returns
void
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:442
renderViewport()
renderViewport(
viewportId):void
Renders only a specific Viewport on the next animation frame.
Parameters
• viewportId: string
The Id of the viewport.
Returns
void
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:466
renderViewports()
renderViewports(
viewportIds):void
Renders the provided Viewport IDs.
Parameters
• viewportIds: string[]
Returns
void
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:457
resize()
resize(
immediate,keepCamera):void
Resizes the offscreen viewport and recalculates translations to on screen canvases. It is up to the parent app to call the resize of the on-screen canvas changes. This is left as an app level concern as one might want to debounce the changes, or the like.
Parameters
• immediate: boolean = true
Whether all of the viewports should be rendered immediately.
• keepCamera: boolean = true
Whether to keep the camera for other viewports while resizing the offscreen canvas
Returns
void
Defined in
packages/core/src/RenderingEngine/RenderingEngine.ts:321
setViewports()
setViewports(
publicViewportInputEntries):void
It takes an array of viewport input objects including element, viewportId, type and defaultOptions. It will add the viewport to the rendering engine and enables them.
renderingEngine.setViewports([
{
viewportId: axialViewportId,
type: ViewportType.ORTHOGRAPHIC,
element: document.getElementById('axialDiv'),
defaultOptions: {
orientation: Enums.OrientationAxis.AXIAL,
},
},
{
viewportId: sagittalViewportId,
type: ViewportType.ORTHOGRAPHIC,
element: document.getElementById('sagittalDiv'),
defaultOptions: {
orientation: Enums.OrientationAxis.SAGITTAL,
},
},
{
viewportId: customOrientationViewportId,
type: ViewportType.ORTHOGRAPHIC,
element: document.getElementById('customOrientationDiv'),
defaultOptions: {
orientation: { viewPlaneNormal: [0, 0, 1], viewUp: [0, 1, 0] },
},
},
])
fires Events.ELEMENT_ENABLED
Parameters
• publicViewportInputEntries: PublicViewportInput[]
Returns
void