@cornerstonejs/core 0.1.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2019 Open Health Imaging Foundation
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,10 @@
+# Cornerstone-render
+
+Cornerstone-3D is a lightweight Javascript library for visualization and manipulation of medical images in modern web browsers that support the HTML5 canvas element.
+
+We have revisited the idea of image rendering in browsers, and re-built various functionalities to enable fast and performant visualization for most complex imaging use cases.
+
+What is new?
+- 3D rendering of medical images
+  - New engine: We have re-architectured the rendering engine for Cornerstone which implemented a WebGL rendering, and have created a wrapper around vtk.js
+  - Shared Texture: Our rendering engine can optimally share textures between canvases, so for complex scenarios that may require > 10 viewports, we share the texture between the viewports that might look into the same data from different angles (axial, sagittal, or coronal) or fuse them on top of each other.

package/dist/cjs/RenderingEngine/RenderingEngine.d.ts

@@ -0,0 +1,75 @@
+import type IStackViewport from '../types/IStackViewport';
+import type IVolumeViewport from '../types/IVolumeViewport';
+import type { PublicViewportInput } from '../types/IViewport';
+export interface IRenderingEngine {
+    uid: string;
+    hasBeenDestroyed: boolean;
+    offscreenMultiRenderWindow: any;
+    offScreenCanvasContainer: any;
+    setViewports(viewports: Array<PublicViewportInput>): void;
+    resize(): void;
+    getViewport(uid: string): IStackViewport | IVolumeViewport;
+    getViewports(): Array<IStackViewport | IVolumeViewport>;
+    render(): void;
+    renderViewports(viewportUIDs: Array<string>): void;
+    renderViewport(viewportUID: string): void;
+    renderFrameOfReference(FrameOfReferenceUID: string): void;
+    fillCanvasWithBackgroundColor(canvas: HTMLCanvasElement, backgroundColor: [number, number, number]): void;
+    enableElement(viewportInputEntry: PublicViewportInput): void;
+    disableElement(viewportUID: string): void;
+    getStackViewports(): Array<IStackViewport>;
+    getVolumeViewports(): Array<IVolumeViewport>;
+    destroy(): void;
+    _debugRender(): void;
+}
+declare class RenderingEngine implements IRenderingEngine {
+    readonly uid: string;
+    hasBeenDestroyed: boolean;
+    offscreenMultiRenderWindow: any;
+    readonly offScreenCanvasContainer: any;
+    private _viewports;
+    private _needsRender;
+    private _animationFrameSet;
+    private _animationFrameHandle;
+    private useCPURendering;
+    constructor(uid?: string);
+    enableElement(viewportInputEntry: PublicViewportInput): void;
+    disableElement(viewportUID: string): void;
+    setViewports(viewportInputEntries: Array<PublicViewportInput>): void;
+    resize(immediate?: boolean, resetPanZoomForViewPlane?: boolean): void;
+    getViewport(uid: string): IStackViewport | IVolumeViewport;
+    getViewports(): Array<IStackViewport | IVolumeViewport>;
+    getStackViewports(): Array<IStackViewport>;
+    getVolumeViewports(): Array<IVolumeViewport>;
+    render(): void;
+    renderFrameOfReference: (FrameOfReferenceUID: string) => void;
+    renderViewports(viewportUIDs: Array<string>): void;
+    renderViewport(viewportUID: string): void;
+    destroy(): void;
+    fillCanvasWithBackgroundColor(canvas: HTMLCanvasElement, backgroundColor: [number, number, number]): void;
+    private _resizeUsingCustomResizeHandler;
+    private _resizeVTKViewports;
+    private enableVTKjsDrivenViewport;
+    private _removeViewport;
+    private addVtkjsDrivenViewport;
+    private addCustomViewport;
+    private setCustomViewports;
+    private setVtkjsDrivenViewports;
+    private _resizeOffScreenCanvas;
+    private _resize;
+    private _getViewportCoordsOnOffScreenCanvas;
+    private _getViewportsAsArray;
+    private _setViewportsToBeRenderedNextFrame;
+    private _render;
+    private _renderFlaggedViewports;
+    private performVtkDrawCall;
+    private renderViewportUsingCustomOrVtkPipeline;
+    private _renderViewportFromVtkCanvasToOnscreenCanvas;
+    private _resetViewport;
+    private _clearAnimationFrame;
+    private _reset;
+    private _throwIfDestroyed;
+    _downloadOffScreenCanvas(): void;
+    _debugRender(): void;
+}
+export default RenderingEngine;

package/dist/cjs/RenderingEngine/RenderingEngine.js

@@ -0,0 +1,547 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const Events_1 = __importDefault(require("../enums/Events"));
+const renderingEngineCache_1 = __importDefault(require("./renderingEngineCache"));
+const eventTarget_1 = __importDefault(require("../eventTarget"));
+const utilities_1 = require("../utilities");
+const vtkClasses_1 = require("./vtkClasses");
+const ViewportType_1 = __importDefault(require("../enums/ViewportType"));
+const VolumeViewport_1 = __importDefault(require("./VolumeViewport"));
+const StackViewport_1 = __importDefault(require("./StackViewport"));
+const viewportTypeUsesCustomRenderingPipeline_1 = __importDefault(require("./helpers/viewportTypeUsesCustomRenderingPipeline"));
+const getOrCreateCanvas_1 = __importDefault(require("./helpers/getOrCreateCanvas"));
+const init_1 = require("../init");
+class RenderingEngine {
+    constructor(uid) {
+        this._needsRender = new Set();
+        this._animationFrameSet = false;
+        this._animationFrameHandle = null;
+        this.renderFrameOfReference = (FrameOfReferenceUID) => {
+            const viewports = this._getViewportsAsArray();
+            const viewportUidsWithSameFrameOfReferenceUID = viewports.map((vp) => {
+                if (vp.getFrameOfReferenceUID() === FrameOfReferenceUID) {
+                    return vp.uid;
+                }
+            });
+            return this.renderViewports(viewportUidsWithSameFrameOfReferenceUID);
+        };
+        this._renderFlaggedViewports = () => {
+            this._throwIfDestroyed();
+            if (!this.useCPURendering) {
+                this.performVtkDrawCall();
+            }
+            const viewports = this._getViewportsAsArray();
+            const eventDetailArray = [];
+            for (let i = 0; i < viewports.length; i++) {
+                const viewport = viewports[i];
+                if (this._needsRender.has(viewport.uid)) {
+                    const eventDetail = this.renderViewportUsingCustomOrVtkPipeline(viewport);
+                    eventDetailArray.push(eventDetail);
+                    this._needsRender.delete(viewport.uid);
+                    if (this._needsRender.size === 0) {
+                        break;
+                    }
+                }
+            }
+            this._animationFrameSet = false;
+            this._animationFrameHandle = null;
+            eventDetailArray.forEach((eventDetail) => {
+                (0, utilities_1.triggerEvent)(eventDetail.element, Events_1.default.IMAGE_RENDERED, eventDetail);
+            });
+        };
+        this.uid = uid ? uid : (0, utilities_1.uuidv4)();
+        this.useCPURendering = (0, init_1.getShouldUseCPURendering)();
+        renderingEngineCache_1.default.set(this);
+        if (!(0, init_1.isCornerstoneInitialized)()) {
+            throw new Error('@cornerstonejs/core is not initialized, run init() first');
+        }
+        if (!this.useCPURendering) {
+            this.offscreenMultiRenderWindow =
+                vtkClasses_1.vtkOffscreenMultiRenderWindow.newInstance();
+            this.offScreenCanvasContainer = document.createElement('div');
+            this.offscreenMultiRenderWindow.setContainer(this.offScreenCanvasContainer);
+        }
+        this._viewports = new Map();
+        this.hasBeenDestroyed = false;
+    }
+    enableElement(viewportInputEntry) {
+        this._throwIfDestroyed();
+        const { element, viewportUID } = viewportInputEntry;
+        if (!element) {
+            throw new Error('No element provided');
+        }
+        const viewport = this.getViewport(viewportUID);
+        if (viewport) {
+            this.disableElement(viewportUID);
+        }
+        const { type } = viewportInputEntry;
+        const viewportUsesCustomRenderingPipeline = (0, viewportTypeUsesCustomRenderingPipeline_1.default)(type);
+        if (!this.useCPURendering && !viewportUsesCustomRenderingPipeline) {
+            this.enableVTKjsDrivenViewport(viewportInputEntry);
+        }
+        else {
+            this.addCustomViewport(viewportInputEntry);
+        }
+        const canvas = (0, getOrCreateCanvas_1.default)(element);
+        const { background } = viewportInputEntry.defaultOptions;
+        this.fillCanvasWithBackgroundColor(canvas, background);
+    }
+    disableElement(viewportUID) {
+        this._throwIfDestroyed();
+        const viewport = this.getViewport(viewportUID);
+        if (!viewport) {
+            console.warn(`viewport ${viewportUID} does not exist`);
+            return;
+        }
+        this._resetViewport(viewport);
+        if (!(0, viewportTypeUsesCustomRenderingPipeline_1.default)(viewport.type) &&
+            !this.useCPURendering) {
+            this.offscreenMultiRenderWindow.removeRenderer(viewportUID);
+        }
+        this._removeViewport(viewportUID);
+        this._needsRender.delete(viewportUID);
+        const viewports = this.getViewports();
+        if (!viewports.length) {
+            this._clearAnimationFrame();
+        }
+        this.resize();
+    }
+    setViewports(viewportInputEntries) {
+        this._throwIfDestroyed();
+        this._reset();
+        const vtkDrivenViewportInputEntries = [];
+        const customRenderingViewportInputEntries = [];
+        viewportInputEntries.forEach((vpie) => {
+            if (!this.useCPURendering &&
+                !(0, viewportTypeUsesCustomRenderingPipeline_1.default)(vpie.type)) {
+                vtkDrivenViewportInputEntries.push(vpie);
+            }
+            else {
+                customRenderingViewportInputEntries.push(vpie);
+            }
+        });
+        this.setVtkjsDrivenViewports(vtkDrivenViewportInputEntries);
+        this.setCustomViewports(customRenderingViewportInputEntries);
+    }
+    resize(immediate = true, resetPanZoomForViewPlane = true) {
+        this._throwIfDestroyed();
+        const viewports = this._getViewportsAsArray();
+        const vtkDrivenViewports = [];
+        const customRenderingViewports = [];
+        viewports.forEach((vpie) => {
+            if (!(0, viewportTypeUsesCustomRenderingPipeline_1.default)(vpie.type)) {
+                vtkDrivenViewports.push(vpie);
+            }
+            else {
+                customRenderingViewports.push(vpie);
+            }
+        });
+        this._resizeVTKViewports(vtkDrivenViewports, immediate, resetPanZoomForViewPlane);
+        this._resizeUsingCustomResizeHandler(customRenderingViewports, immediate, resetPanZoomForViewPlane);
+    }
+    getViewport(uid) {
+        return this._viewports.get(uid);
+    }
+    getViewports() {
+        this._throwIfDestroyed();
+        return this._getViewportsAsArray();
+    }
+    getStackViewports() {
+        this._throwIfDestroyed();
+        const viewports = this.getViewports();
+        const isStackViewport = (viewport) => {
+            return viewport instanceof StackViewport_1.default;
+        };
+        return viewports.filter(isStackViewport);
+    }
+    getVolumeViewports() {
+        this._throwIfDestroyed();
+        const viewports = this.getViewports();
+        const isVolumeViewport = (viewport) => {
+            return viewport instanceof VolumeViewport_1.default;
+        };
+        return viewports.filter(isVolumeViewport);
+    }
+    render() {
+        const viewports = this.getViewports();
+        const viewportUIDs = viewports.map((vp) => vp.uid);
+        this._setViewportsToBeRenderedNextFrame(viewportUIDs);
+    }
+    renderViewports(viewportUIDs) {
+        this._setViewportsToBeRenderedNextFrame(viewportUIDs);
+    }
+    renderViewport(viewportUID) {
+        this._setViewportsToBeRenderedNextFrame([viewportUID]);
+    }
+    destroy() {
+        if (this.hasBeenDestroyed) {
+            return;
+        }
+        this._reset();
+        renderingEngineCache_1.default.delete(this.uid);
+        if (!this.useCPURendering) {
+            this.offscreenMultiRenderWindow.delete();
+            delete this.offscreenMultiRenderWindow;
+        }
+        this.hasBeenDestroyed = true;
+    }
+    fillCanvasWithBackgroundColor(canvas, backgroundColor) {
+        const ctx = canvas.getContext('2d');
+        let fillStyle;
+        if (backgroundColor) {
+            const rgb = backgroundColor.map((f) => Math.floor(255 * f));
+            fillStyle = `rgb(${rgb[0]}, ${rgb[1]}, ${rgb[2]})`;
+        }
+        else {
+            fillStyle = 'black';
+        }
+        ctx.fillStyle = fillStyle;
+        ctx.fillRect(0, 0, canvas.width, canvas.height);
+    }
+    _resizeUsingCustomResizeHandler(customRenderingViewports, immediate = true, resetPanZoomForViewPlane = true) {
+        customRenderingViewports.forEach((vp) => {
+            if (typeof vp.resize === 'function')
+                vp.resize();
+        });
+        customRenderingViewports.forEach((vp) => {
+            vp.resetCamera(resetPanZoomForViewPlane);
+        });
+        if (immediate === true) {
+            this.render();
+        }
+    }
+    _resizeVTKViewports(vtkDrivenViewports, resetPanZoomForViewPlane = true, immediate = true) {
+        const canvasesDrivenByVtkJs = vtkDrivenViewports.map((vp) => vp.canvas);
+        if (canvasesDrivenByVtkJs.length) {
+            const { offScreenCanvasWidth, offScreenCanvasHeight } = this._resizeOffScreenCanvas(canvasesDrivenByVtkJs);
+            this._resize(vtkDrivenViewports, offScreenCanvasWidth, offScreenCanvasHeight);
+        }
+        vtkDrivenViewports.forEach((vp) => {
+            vp.resetCamera(resetPanZoomForViewPlane);
+        });
+        if (immediate === true) {
+            this.render();
+        }
+    }
+    enableVTKjsDrivenViewport(viewportInputEntry) {
+        const viewports = this._getViewportsAsArray();
+        const viewportsDrivenByVtkJs = viewports.filter((vp) => (0, viewportTypeUsesCustomRenderingPipeline_1.default)(vp.type) === false);
+        const canvasesDrivenByVtkJs = viewportsDrivenByVtkJs.map((vp) => vp.canvas);
+        const canvas = (0, getOrCreateCanvas_1.default)(viewportInputEntry.element);
+        canvasesDrivenByVtkJs.push(canvas);
+        const { offScreenCanvasWidth, offScreenCanvasHeight } = this._resizeOffScreenCanvas(canvasesDrivenByVtkJs);
+        const xOffset = this._resize(viewportsDrivenByVtkJs, offScreenCanvasWidth, offScreenCanvasHeight);
+        const internalViewportEntry = Object.assign(Object.assign({}, viewportInputEntry), { canvas });
+        this.addVtkjsDrivenViewport(internalViewportEntry, {
+            offScreenCanvasWidth,
+            offScreenCanvasHeight,
+            xOffset,
+        });
+    }
+    _removeViewport(viewportUID) {
+        const viewport = this.getViewport(viewportUID);
+        if (!viewport) {
+            console.warn(`viewport ${viewportUID} does not exist`);
+            return;
+        }
+        this._viewports.delete(viewportUID);
+    }
+    addVtkjsDrivenViewport(viewportInputEntry, offscreenCanvasProperties) {
+        const { element, canvas, viewportUID, type, defaultOptions } = viewportInputEntry;
+        element.tabIndex = -1;
+        const { offScreenCanvasWidth, offScreenCanvasHeight, xOffset } = offscreenCanvasProperties;
+        const { sxStartDisplayCoords, syStartDisplayCoords, sxEndDisplayCoords, syEndDisplayCoords, sx, sy, sWidth, sHeight, } = this._getViewportCoordsOnOffScreenCanvas(viewportInputEntry, offScreenCanvasWidth, offScreenCanvasHeight, xOffset);
+        this.offscreenMultiRenderWindow.addRenderer({
+            viewport: [
+                sxStartDisplayCoords,
+                syStartDisplayCoords,
+                sxEndDisplayCoords,
+                syEndDisplayCoords,
+            ],
+            uid: viewportUID,
+            background: defaultOptions.background
+                ? defaultOptions.background
+                : [0, 0, 0],
+        });
+        const viewportInput = {
+            uid: viewportUID,
+            element,
+            renderingEngineUID: this.uid,
+            type,
+            canvas,
+            sx,
+            sy,
+            sWidth,
+            sHeight,
+            defaultOptions: defaultOptions || {},
+        };
+        let viewport;
+        if (type === ViewportType_1.default.STACK) {
+            viewport = new StackViewport_1.default(viewportInput);
+        }
+        else if (type === ViewportType_1.default.ORTHOGRAPHIC) {
+            viewport = new VolumeViewport_1.default(viewportInput);
+        }
+        else {
+            throw new Error(`Viewport Type ${type} is not supported`);
+        }
+        this._viewports.set(viewportUID, viewport);
+        const eventDetail = {
+            element,
+            viewportUID,
+            renderingEngineUID: this.uid,
+        };
+        if (!viewport.suppressEvents) {
+            (0, utilities_1.triggerEvent)(eventTarget_1.default, Events_1.default.ELEMENT_ENABLED, eventDetail);
+        }
+    }
+    addCustomViewport(viewportInputEntry) {
+        const { element, viewportUID, type, defaultOptions } = viewportInputEntry;
+        element.tabIndex = -1;
+        const canvas = (0, getOrCreateCanvas_1.default)(element);
+        const { clientWidth, clientHeight } = canvas;
+        if (canvas.width !== clientWidth || canvas.height !== clientHeight) {
+            canvas.width = clientWidth;
+            canvas.height = clientHeight;
+        }
+        const viewportInput = {
+            uid: viewportUID,
+            renderingEngineUID: this.uid,
+            element,
+            type,
+            canvas,
+            sx: 0,
+            sy: 0,
+            sWidth: clientWidth,
+            sHeight: clientHeight,
+            defaultOptions: defaultOptions || {},
+        };
+        if (type !== ViewportType_1.default.STACK) {
+            throw new Error('Support for fully custom viewports not yet implemented');
+        }
+        const viewport = new StackViewport_1.default(viewportInput);
+        this._viewports.set(viewportUID, viewport);
+        const eventDetail = {
+            element,
+            viewportUID,
+            renderingEngineUID: this.uid,
+        };
+        (0, utilities_1.triggerEvent)(eventTarget_1.default, Events_1.default.ELEMENT_ENABLED, eventDetail);
+    }
+    setCustomViewports(viewportInputEntries) {
+        viewportInputEntries.forEach((vpie) => this.addCustomViewport(vpie));
+    }
+    setVtkjsDrivenViewports(viewportInputEntries) {
+        if (viewportInputEntries.length) {
+            const vtkDrivenCanvases = viewportInputEntries.map((vp) => (0, getOrCreateCanvas_1.default)(vp.element));
+            const { offScreenCanvasWidth, offScreenCanvasHeight } = this._resizeOffScreenCanvas(vtkDrivenCanvases);
+            let xOffset = 0;
+            for (let i = 0; i < viewportInputEntries.length; i++) {
+                const vtkDrivenViewportInputEntry = viewportInputEntries[i];
+                const canvas = vtkDrivenCanvases[i];
+                const internalViewportEntry = Object.assign(Object.assign({}, vtkDrivenViewportInputEntry), { canvas });
+                this.addVtkjsDrivenViewport(internalViewportEntry, {
+                    offScreenCanvasWidth,
+                    offScreenCanvasHeight,
+                    xOffset,
+                });
+                xOffset += canvas.clientWidth;
+            }
+        }
+    }
+    _resizeOffScreenCanvas(canvasesDrivenByVtkJs) {
+        const { offScreenCanvasContainer, offscreenMultiRenderWindow } = this;
+        const offScreenCanvasHeight = Math.max(...canvasesDrivenByVtkJs.map((canvas) => canvas.clientHeight));
+        let offScreenCanvasWidth = 0;
+        canvasesDrivenByVtkJs.forEach((canvas) => {
+            offScreenCanvasWidth += canvas.clientWidth;
+        });
+        offScreenCanvasContainer.width = offScreenCanvasWidth;
+        offScreenCanvasContainer.height = offScreenCanvasHeight;
+        offscreenMultiRenderWindow.resize();
+        return { offScreenCanvasWidth, offScreenCanvasHeight };
+    }
+    _resize(viewportsDrivenByVtkJs, offScreenCanvasWidth, offScreenCanvasHeight) {
+        let _xOffset = 0;
+        for (let i = 0; i < viewportsDrivenByVtkJs.length; i++) {
+            const viewport = viewportsDrivenByVtkJs[i];
+            const { sxStartDisplayCoords, syStartDisplayCoords, sxEndDisplayCoords, syEndDisplayCoords, sx, sy, sWidth, sHeight, } = this._getViewportCoordsOnOffScreenCanvas(viewport, offScreenCanvasWidth, offScreenCanvasHeight, _xOffset);
+            _xOffset += viewport.element.clientWidth;
+            viewport.sx = sx;
+            viewport.sy = sy;
+            viewport.sWidth = sWidth;
+            viewport.sHeight = sHeight;
+            const renderer = this.offscreenMultiRenderWindow.getRenderer(viewport.uid);
+            renderer.setViewport([
+                sxStartDisplayCoords,
+                syStartDisplayCoords,
+                sxEndDisplayCoords,
+                syEndDisplayCoords,
+            ]);
+        }
+        return _xOffset;
+    }
+    _getViewportCoordsOnOffScreenCanvas(viewport, offScreenCanvasWidth, offScreenCanvasHeight, _xOffset) {
+        const { canvas } = viewport;
+        const { clientWidth, clientHeight } = canvas;
+        if (canvas.width !== clientWidth || canvas.height !== clientHeight) {
+            canvas.width = clientWidth;
+            canvas.height = clientHeight;
+        }
+        const sx = _xOffset;
+        const sy = 0;
+        const sWidth = clientWidth;
+        const sHeight = clientHeight;
+        const sxStartDisplayCoords = sx / offScreenCanvasWidth;
+        const syStartDisplayCoords = sy + (offScreenCanvasHeight - clientHeight) / offScreenCanvasHeight;
+        const sWidthDisplayCoords = sWidth / offScreenCanvasWidth;
+        const sHeightDisplayCoords = sHeight / offScreenCanvasHeight;
+        return {
+            sxStartDisplayCoords,
+            syStartDisplayCoords,
+            sxEndDisplayCoords: sxStartDisplayCoords + sWidthDisplayCoords,
+            syEndDisplayCoords: syStartDisplayCoords + sHeightDisplayCoords,
+            sx,
+            sy,
+            sWidth,
+            sHeight,
+        };
+    }
+    _getViewportsAsArray() {
+        return Array.from(this._viewports.values());
+    }
+    _setViewportsToBeRenderedNextFrame(viewportUIDs) {
+        viewportUIDs.forEach((viewportUID) => {
+            this._needsRender.add(viewportUID);
+        });
+        this._render();
+    }
+    _render() {
+        if (this._needsRender.size > 0 && this._animationFrameSet === false) {
+            this._animationFrameHandle = window.requestAnimationFrame(this._renderFlaggedViewports);
+            this._animationFrameSet = true;
+        }
+    }
+    performVtkDrawCall() {
+        const { offscreenMultiRenderWindow } = this;
+        const renderWindow = offscreenMultiRenderWindow.getRenderWindow();
+        const renderers = offscreenMultiRenderWindow.getRenderers();
+        if (!renderers.length) {
+            return;
+        }
+        for (let i = 0; i < renderers.length; i++) {
+            const { renderer, uid } = renderers[i];
+            if (this._needsRender.has(uid)) {
+                renderer.setDraw(true);
+            }
+            else {
+                renderer.setDraw(false);
+            }
+        }
+        renderWindow.render();
+        for (let i = 0; i < renderers.length; i++) {
+            renderers[i].renderer.setDraw(false);
+        }
+    }
+    renderViewportUsingCustomOrVtkPipeline(viewport) {
+        let eventDetail;
+        if ((0, viewportTypeUsesCustomRenderingPipeline_1.default)(viewport.type) === true) {
+            eventDetail =
+                viewport.customRenderViewportToCanvas();
+        }
+        else {
+            if (this.useCPURendering) {
+                throw new Error('GPU not available, and using a viewport with no custom render pipeline.');
+            }
+            const { offscreenMultiRenderWindow } = this;
+            const openGLRenderWindow = offscreenMultiRenderWindow.getOpenGLRenderWindow();
+            const context = openGLRenderWindow.get3DContext();
+            const offScreenCanvas = context.canvas;
+            eventDetail = this._renderViewportFromVtkCanvasToOnscreenCanvas(viewport, offScreenCanvas);
+        }
+        return eventDetail;
+    }
+    _renderViewportFromVtkCanvasToOnscreenCanvas(viewport, offScreenCanvas) {
+        const { element, canvas, sx, sy, sWidth, sHeight, uid, renderingEngineUID, suppressEvents, } = viewport;
+        const { width: dWidth, height: dHeight } = canvas;
+        const onScreenContext = canvas.getContext('2d');
+        onScreenContext.drawImage(offScreenCanvas, sx, sy, sWidth, sHeight, 0, 0, dWidth, dHeight);
+        return {
+            element,
+            suppressEvents,
+            viewportUID: uid,
+            renderingEngineUID,
+        };
+    }
+    _resetViewport(viewport) {
+        const renderingEngineUID = this.uid;
+        const { element, canvas, uid: viewportUID } = viewport;
+        const eventDetail = {
+            element,
+            viewportUID,
+            renderingEngineUID,
+        };
+        (0, utilities_1.triggerEvent)(eventTarget_1.default, Events_1.default.ELEMENT_DISABLED, eventDetail);
+        element.removeAttribute('data-viewport-uid');
+        element.removeAttribute('data-rendering-engine-uid');
+        const context = canvas.getContext('2d');
+        context.clearRect(0, 0, canvas.width, canvas.height);
+    }
+    _clearAnimationFrame() {
+        window.cancelAnimationFrame(this._animationFrameHandle);
+        this._needsRender.clear();
+        this._animationFrameSet = false;
+        this._animationFrameHandle = null;
+    }
+    _reset() {
+        const viewports = this._getViewportsAsArray();
+        viewports.forEach((viewport) => {
+            this._resetViewport(viewport);
+        });
+        this._clearAnimationFrame();
+        this._viewports = new Map();
+    }
+    _throwIfDestroyed() {
+        if (this.hasBeenDestroyed) {
+            throw new Error('this.destroy() has been manually called to free up memory, can not longer use this instance. Instead make a new one.');
+        }
+    }
+    _downloadOffScreenCanvas() {
+        const dataURL = this._debugRender();
+        _TEMPDownloadURI(dataURL);
+    }
+    _debugRender() {
+        const { offscreenMultiRenderWindow } = this;
+        const renderWindow = offscreenMultiRenderWindow.getRenderWindow();
+        const renderers = offscreenMultiRenderWindow.getRenderers();
+        for (let i = 0; i < renderers.length; i++) {
+            renderers[i].renderer.setDraw(true);
+        }
+        renderWindow.render();
+        const openGLRenderWindow = offscreenMultiRenderWindow.getOpenGLRenderWindow();
+        const context = openGLRenderWindow.get3DContext();
+        const offScreenCanvas = context.canvas;
+        const dataURL = offScreenCanvas.toDataURL();
+        this._getViewportsAsArray().forEach((viewport) => {
+            const { sx, sy, sWidth, sHeight } = viewport;
+            const canvas = viewport.canvas;
+            const { width: dWidth, height: dHeight } = canvas;
+            const onScreenContext = canvas.getContext('2d');
+            onScreenContext.drawImage(offScreenCanvas, sx, sy, sWidth, sHeight, 0, 0, dWidth, dHeight);
+        });
+        return dataURL;
+    }
+}
+exports.default = RenderingEngine;
+function _TEMPDownloadURI(uri) {
+    const link = document.createElement('a');
+    link.download = 'viewport.png';
+    link.href = uri;
+    document.body.appendChild(link);
+    link.click();
+    document.body.removeChild(link);
+}
+//# sourceMappingURL=RenderingEngine.js.map