@cornerstonejs/core 5.0.0-beta.1 → 5.0.0

package/dist/esm/RenderingEngine/GenericViewport/Planar/PlanarViewport.js

@@ -0,0 +1,1175 @@
+import { Events, OrientationAxis, ViewportStatus, ViewportType, VOILUTFunctionType, } from '../../../enums';
+import { ActorRenderMode } from '../../../types';
+import cache from '../../../cache/cache';
+import { deepClone } from '../../../utilities/deepClone';
+import imageIdToURI from '../../../utilities/imageIdToURI';
+import { getImageDataMetadata } from '../../../utilities/getImageDataMetadata';
+import genericViewportDataSetMetadataProvider from '../../../utilities/genericViewportDataSetMetadataProvider';
+import triggerEvent from '../../../utilities/triggerEvent';
+import getMinMax from '../../../utilities/getMinMax';
+import renderingEngineCache from '../../renderingEngineCache';
+import { getCameraVectors } from '../../helpers/getCameraVectors';
+import GenericViewport from '../GenericViewport';
+import { getGenericViewportImageDataSet, isGenericViewportImageDataSet, } from '../genericViewportDataSetAccess';
+import { DefaultPlanarDataProvider } from './DefaultPlanarDataProvider';
+import { createPlanarRenderPathResolver } from './PlanarRenderPathResolver';
+import { normalizePlanarOrientation, selectPlanarRenderPath, } from './planarRenderPathSelector';
+import { clonePlanarOrientation } from './planarLegacyCompatibility';
+import { normalizePlanarRotation } from './planarViewPresentation';
+import { cloneDisplayArea, createDefaultPlanarViewState, normalizePlanarViewState, } from './planarViewState';
+import { normalizePlanarScale, } from './planarCameraScale';
+import { getPlanarProjectionPan, getPlanarProjectionScale, getPlanarProjectionSnapshot, getPlanarProjectionZoom, } from './planarProjectionAdapter';
+import { getPlanarViewStateCanvasDimensions, resolvePlanarViewportView, } from './PlanarResolvedView';
+import { createPlanarCpuVolumeSliceBasis, createPlanarVolumeSliceBasis, } from './planarSliceBasis';
+import PlanarMountedData from './PlanarMountedData';
+import PlanarViewReferenceController from './PlanarViewReferenceController';
+class PlanarViewport extends GenericViewport {
+    static get useCustomRenderingPipeline() {
+        return false;
+    }
+    constructor(args) {
+        super(args);
+        this.type = ViewportType.PLANAR_NEXT;
+        this.suppressEvents = false;
+        this.resolvedViewCacheRevision = 0;
+        this.setDataRequestId = 0;
+        this.renderingEngineId = args.renderingEngineId;
+        this.canvas = args.canvas;
+        this.sWidth = args.sWidth;
+        this.sHeight = args.sHeight;
+        this.defaultOptions = cloneViewportOptions(args.defaultOptions || {});
+        this.options = cloneViewportOptions(this.defaultOptions);
+        this.canvasToWorld = this.canvasToWorld.bind(this);
+        this.worldToCanvas = this.worldToCanvas.bind(this);
+        this.dataProvider = args.dataProvider || new DefaultPlanarDataProvider();
+        this.renderPathResolver =
+            args.renderPathResolver || createPlanarRenderPathResolver();
+        this.mountedData = new PlanarMountedData({
+            getBinding: (dataId) => this.getBinding(dataId),
+            getFirstBinding: () => this.getFirstBinding(),
+            getBindings: () => this.bindings.entries(),
+            removeData: (dataId) => this.removeData(dataId),
+        });
+        this.viewReferences = new PlanarViewReferenceController({
+            viewportId: this.id,
+            viewportType: this.type,
+            getActiveDataId: () => this.mountedData.getActiveDataId(),
+            getBinding: (dataId) => this.getBinding(dataId),
+            getBindings: () => this.bindings.entries(),
+            getCurrentBinding: () => this.getCurrentBinding(),
+            getRenderContext: () => this.renderContext,
+            getResolvedView: (viewArgs) => this.getResolvedView(viewArgs),
+            getViewState: () => this.viewState,
+            getVolumeSliceWorldPointForImageIdIndex: (imageIdIndex) => this.getVolumeSliceWorldPointForImageIdIndex(imageIdIndex),
+            promoteSourceDataId: (dataId) => {
+                this.clearResolvedViewCache();
+                this.mountedData.promoteSourceDataId(dataId);
+            },
+            render: () => this.render(),
+            setImageIdIndex: (imageIdIndex) => this.setImageIdIndex(imageIdIndex),
+            setViewState: (viewStatePatch) => this.setViewState(viewStatePatch),
+            updateBindingsCameraState: () => this.updateBindingsCameraState(),
+        });
+        const renderingEngine = renderingEngineCache.get(this.renderingEngineId);
+        const renderer = renderingEngine?.getRenderer(this.id);
+        if (!renderer) {
+            throw new Error('[PlanarViewport] No renderer available. Ensure WebGL is supported and the rendering engine has been properly initialized.');
+        }
+        this.element.style.position = this.element.style.position || 'relative';
+        this.element.style.overflow = 'hidden';
+        this.element.style.background = this.element.style.background || '#000';
+        const vtkCanvas = args.canvas;
+        const viewportElement = this.element.querySelector('.viewport-element');
+        const cpuCanvas = document.createElement('canvas');
+        cpuCanvas.style.display = 'none';
+        cpuCanvas.style.height = '100%';
+        cpuCanvas.style.inset = '0';
+        cpuCanvas.style.pointerEvents = 'none';
+        cpuCanvas.style.position = 'absolute';
+        cpuCanvas.style.width = '100%';
+        cpuCanvas.style.zIndex = '0';
+        this.element.appendChild(cpuCanvas);
+        this.cpuCanvas = cpuCanvas;
+        if (viewportElement) {
+            viewportElement.style.position =
+                viewportElement.style.position || 'relative';
+            viewportElement.style.zIndex = '1';
+        }
+        const cpuCanvasContext = cpuCanvas.getContext('2d');
+        if (!cpuCanvasContext) {
+            throw new Error('[PlanarViewport] Failed to initialize CPU canvas');
+        }
+        renderer.getActiveCamera().setParallelProjection(true);
+        this.renderContext = {
+            viewportId: this.id,
+            renderingEngineId: this.renderingEngineId,
+            type: 'planar',
+            viewport: {
+                element: this.element,
+                getActiveDataId: () => this.mountedData.getActiveDataId(),
+                invalidateResolvedView: () => this.clearResolvedViewCache(),
+                getViewState: () => this.getViewState(),
+                isCurrentDataId: (dataId) => this.getCurrentBinding()?.data.id === dataId,
+                getOverlayActors: () => this.mountedData.getProjectedActorEntries('overlay'),
+            },
+            renderPath: {
+                renderMode: ActorRenderMode.VTK_IMAGE,
+            },
+            view: {},
+            display: {
+                requestRender: () => {
+                    this.requestRenderingEngineRender();
+                },
+                renderNow: () => {
+                    this.render();
+                },
+                setNeedsRender: () => {
+                    this.setNeedsRender();
+                },
+                markRendered: () => {
+                    this.setRendered();
+                },
+                activateRenderMode: (renderMode) => {
+                    this.renderContext.renderPath.renderMode = renderMode;
+                    this.setRenderModeVisibility(renderMode, cpuCanvas, vtkCanvas);
+                },
+            },
+            cpu: {
+                canvas: cpuCanvas,
+                composition: {
+                    clearedRenderPassId: -1,
+                    renderPassId: 0,
+                },
+                context: cpuCanvasContext,
+            },
+            vtk: {
+                renderer,
+                canvas: vtkCanvas,
+            },
+        };
+        this.viewState = normalizePlanarViewState({
+            ...createDefaultPlanarViewState(),
+            orientation: this.resolveRequestedOrientation(),
+        });
+        this.setRenderModeVisibility(ActorRenderMode.VTK_IMAGE, cpuCanvas, vtkCanvas);
+        this.element.setAttribute('data-viewport-uid', this.id);
+        this.element.setAttribute('data-rendering-engine-uid', this.renderingEngineId);
+        this.resize();
+    }
+    async setDisplaySets(...entries) {
+        const requestId = ++this.setDataRequestId;
+        const isStale = () => requestId !== this.setDataRequestId;
+        this.clearResolvedViewCache();
+        this.removeAllData();
+        for (const [index, { displaySetId, options = {} }] of entries.entries()) {
+            if (isStale()) {
+                return;
+            }
+            const role = options.role ?? (index === 0 ? 'source' : 'overlay');
+            await this.addDisplaySetInternal(displaySetId, {
+                ...options,
+                role,
+            }, isStale);
+        }
+    }
+    async addDisplaySet(displaySetId, options = {}) {
+        await this.addDisplaySetInternal(displaySetId, options);
+        this.clearResolvedViewCache();
+    }
+    async addDisplaySetInternal(dataId, options = {}, shouldIgnore) {
+        const role = this.mountedData.resolveBindingRole(options);
+        const resolvedOptions = {
+            ...options,
+            role,
+        };
+        const { data, resolvedOrientation, selectedPath } = await this.loadPlanarData(dataId, resolvedOptions);
+        if (shouldIgnore?.()) {
+            return;
+        }
+        if (role === 'source') {
+            this.mountedData.promoteSourceDataId(dataId);
+            this.applyLoadedPlanarViewState(resolvedOrientation, data, selectedPath);
+        }
+        const added = await this.addLoadedData(dataId, data, {
+            renderMode: selectedPath.renderMode,
+            role,
+        }, shouldIgnore);
+        if (!added) {
+            return;
+        }
+        this.clearResolvedViewCache();
+        this.setDefaultDataPresentation(dataId, {
+            visible: true,
+        });
+    }
+    removeData(dataId) {
+        this.clearResolvedViewCache();
+        super.removeData(dataId);
+        this.mountedData.handleRemovedData(dataId);
+        if (!this.isDestroyed && this.getCurrentBinding()) {
+            this.updateBindingsCameraState();
+        }
+    }
+    getActors() {
+        return this.mountedData.getActors();
+    }
+    getDefaultActor() {
+        return this.mountedData.getDefaultActor();
+    }
+    renderImageObject(image) {
+        const dataId = `image-object:${this.id}:${imageIdToURI(image.imageId)}`;
+        if (this.renderImageObjectDataId &&
+            this.renderImageObjectDataId !== dataId) {
+            genericViewportDataSetMetadataProvider.remove(this.renderImageObjectDataId);
+        }
+        this.renderImageObjectDataId = dataId;
+        genericViewportDataSetMetadataProvider.add(dataId, {
+            image,
+            imageIds: [image.imageId],
+            initialImageIdIndex: 0,
+            kind: 'planar',
+        });
+        return this.setDisplaySets({
+            displaySetId: dataId,
+            options: {
+                orientation: this.resolveRequestedOrientation(),
+            },
+        });
+    }
+    getCanvas() {
+        const rendering = this.getCurrentPlanarRendering();
+        if (rendering?.renderMode === ActorRenderMode.CPU_IMAGE ||
+            rendering?.renderMode === ActorRenderMode.CPU_VOLUME) {
+            return this.renderContext.cpu.canvas;
+        }
+        return this.renderContext.vtk.canvas;
+    }
+    async addImages(stackInputs) {
+        const rendering = this.getCurrentPlanarRendering();
+        if (rendering?.renderMode !== ActorRenderMode.VTK_IMAGE &&
+            rendering?.renderMode !== ActorRenderMode.VTK_VOLUME_SLICE &&
+            rendering?.renderMode !== ActorRenderMode.CPU_IMAGE) {
+            return;
+        }
+        for (const stackInput of stackInputs) {
+            const image = this.resolveStackInputImage(stackInput);
+            if (!image) {
+                continue;
+            }
+            const reference = this.resolveOverlayReference(stackInput, image);
+            const dataId = this.resolveOverlayDataId(stackInput, image, reference);
+            genericViewportDataSetMetadataProvider.add(dataId, {
+                image,
+                imageData: stackInput.imageData,
+                imageIds: [stackInput.imageId],
+                initialImageIdIndex: 0,
+                kind: 'planar',
+                reference,
+                useWorldCoordinateImageData: stackInput.useWorldCoordinateImageData === true,
+            });
+            await this.addDisplaySet(dataId, {
+                role: 'overlay',
+            });
+            const actorEntry = this.mountedData.getActorForDataId(dataId);
+            if (stackInput.callback && actorEntry) {
+                stackInput.callback({
+                    imageActor: actorEntry.actor,
+                    imageId: stackInput.imageId,
+                });
+            }
+        }
+        this.render();
+    }
+    getImageDataMetadata(image) {
+        return getImageDataMetadata(image);
+    }
+    getImageIds() {
+        const planarData = this.getPlanarData();
+        if (!planarData) {
+            return [];
+        }
+        return planarData.imageVolume?.imageIds || planarData.imageIds;
+    }
+    getVolumeId(viewRefSpecifier = {}) {
+        return (this.viewReferences.getVolumeId(viewRefSpecifier) ??
+            this.getPlanarData()?.volumeId);
+    }
+    getSourceDataId() {
+        return this.mountedData.getActiveDataId();
+    }
+    getDefaultVOIRange(dataId) {
+        return this.mountedData.getDefaultVOIRange(dataId);
+    }
+    getCurrentImageIdIndex() {
+        return this.getActiveImageIdIndex();
+    }
+    getCurrentImageId(viewRefSpecifier = {}) {
+        return this.viewReferences.getCurrentImageId(viewRefSpecifier);
+    }
+    getSliceIndex() {
+        return this.getCurrentImageIdIndex();
+    }
+    normalizeViewState(viewState) {
+        return normalizePlanarViewState(viewState);
+    }
+    setViewState(viewStatePatch) {
+        if (this.isDestroyed) {
+            return;
+        }
+        const previousCamera = this.getResolvedCameraForEvent();
+        if (Object.prototype.hasOwnProperty.call(viewStatePatch, 'displayArea')) {
+            this.options = {
+                ...this.options,
+                displayArea: cloneDisplayArea(viewStatePatch.displayArea),
+            };
+        }
+        const next = {
+            ...this.viewState,
+            ...viewStatePatch,
+        };
+        this.clearResolvedViewCache();
+        this.viewState = this.normalizeViewState(next);
+        this.modified(previousCamera);
+    }
+    setDisplaySetPresentation(displaySetIdOrProps, maybeProps) {
+        this.clearResolvedViewCache();
+        if (typeof displaySetIdOrProps === 'string') {
+            super.setDisplaySetPresentation(displaySetIdOrProps, maybeProps ?? {});
+            return;
+        }
+        super.setDisplaySetPresentation(displaySetIdOrProps);
+    }
+    setDataPresentationState(dataId, props) {
+        this.clearResolvedViewCache();
+        super.setDataPresentationState(dataId, props);
+    }
+    getRotation() {
+        return (this.getResolvedView()?.rotation ??
+            normalizePlanarRotation(this.viewState.rotation));
+    }
+    getAnchorWorld() {
+        const anchorWorld = this.viewState.anchorWorld;
+        return anchorWorld ? [...anchorWorld] : undefined;
+    }
+    setAnchorWorld(point) {
+        this.setViewState({
+            anchorWorld: point ? [...point] : undefined,
+        });
+    }
+    setOptions(options, immediate = false) {
+        this.options = cloneViewportOptions(options);
+        if (this.options.displayArea) {
+            this.setDisplayArea(this.options.displayArea, this.options.suppressEvents ?? false);
+        }
+        if (immediate) {
+            this.render();
+        }
+    }
+    reset(immediate = false) {
+        this.options = cloneViewportOptions(this.defaultOptions);
+        if (immediate) {
+            this.render();
+        }
+    }
+    getDisplayArea() {
+        return cloneDisplayArea(this.viewState.displayArea ?? this.options.displayArea);
+    }
+    setDisplayArea(displayArea, suppressEvents = false) {
+        const nextDisplayArea = cloneDisplayArea(displayArea);
+        if (!nextDisplayArea) {
+            return;
+        }
+        this.options = {
+            ...this.options,
+            displayArea: cloneDisplayArea(nextDisplayArea),
+        };
+        this.setViewState({
+            anchorCanvas: [0.5, 0.5],
+            anchorWorld: undefined,
+            displayArea: nextDisplayArea,
+            scale: [1, 1],
+            scaleMode: nextDisplayArea.scaleMode ?? 'fit',
+        });
+        if (!suppressEvents && !this.suppressEvents) {
+            triggerEvent(this.element, Events.DISPLAY_AREA_MODIFIED, {
+                viewportId: this.id,
+                displayArea: cloneDisplayArea(nextDisplayArea),
+                storeAsInitialCamera: nextDisplayArea.storeAsInitialCamera,
+            });
+        }
+    }
+    getZoom() {
+        return getPlanarProjectionZoom(this.getProjectionSnapshot());
+    }
+    getScale() {
+        return getPlanarProjectionScale(this.getProjectionSnapshot());
+    }
+    setZoom(zoom, canvasPoint) {
+        this.setScale(zoom, canvasPoint);
+    }
+    setScale(scale, canvasPoint) {
+        const resolvedView = this.getResolvedView();
+        const nextScale = normalizePlanarScale(scale);
+        if (resolvedView) {
+            this.applyResolvedViewState(resolvedView.withScale(nextScale, canvasPoint).state.viewState);
+            return;
+        }
+        if (canvasPoint) {
+            this.setScaleAtCanvasPoint(nextScale, canvasPoint);
+            return;
+        }
+        this.setViewState({
+            displayArea: undefined,
+            scale: nextScale,
+            scaleMode: 'fit',
+        });
+    }
+    getPan() {
+        return getPlanarProjectionPan(this.getProjectionSnapshot());
+    }
+    setPan(nextPan) {
+        const resolvedView = this.getResolvedView();
+        if (resolvedView) {
+            this.applyResolvedViewState(resolvedView.withPan(nextPan).state.viewState);
+            return;
+        }
+        this.applyResolvedViewState(this.getFallbackViewStateWithPan(this.viewState, nextPan));
+    }
+    setScaleAtCanvasPoint(scale, canvasPoint) {
+        const resolvedView = this.getResolvedView();
+        const nextScale = normalizePlanarScale(scale);
+        if (resolvedView) {
+            this.applyResolvedViewState(resolvedView.withScale(nextScale, canvasPoint).state.viewState);
+            return;
+        }
+        const worldPoint = this.buildFallbackCanvasToWorld(canvasPoint);
+        const { height: canvasHeight, width: canvasWidth } = this.getCurrentCanvasDimensions();
+        this.setViewState({
+            anchorWorld: worldPoint,
+            anchorCanvas: [
+                canvasPoint[0] / Math.max(canvasWidth, 1),
+                canvasPoint[1] / Math.max(canvasHeight, 1),
+            ],
+            displayArea: undefined,
+            scale: nextScale,
+            scaleMode: 'fit',
+        });
+    }
+    getViewState() {
+        return normalizePlanarViewState(this.viewState);
+    }
+    getResolvedView(args = {}) {
+        return this.resolveCachedViewState(this.viewState, args);
+    }
+    getRenderingEngine() {
+        return renderingEngineCache.get(this.renderingEngineId);
+    }
+    getViewReference(viewRefSpecifier = {}) {
+        return this.viewReferences.getViewReference(viewRefSpecifier);
+    }
+    getViewReferenceId(viewRefSpecifier = {}) {
+        return this.viewReferences.getViewReferenceId(viewRefSpecifier);
+    }
+    setViewReference(viewRef) {
+        this.viewReferences.setViewReference(viewRef);
+    }
+    getImageData() {
+        return this.getCurrentBinding()?.getImageData?.();
+    }
+    canvasToWorld(canvasPos) {
+        const resolvedView = this.getResolvedView();
+        if (!resolvedView) {
+            return this.buildFallbackCanvasToWorld(canvasPos);
+        }
+        return resolvedView.canvasToWorld(canvasPos);
+    }
+    worldToCanvas(worldPos) {
+        const resolvedView = this.getResolvedView();
+        if (!resolvedView) {
+            return this.buildFallbackWorldToCanvas(worldPos);
+        }
+        return resolvedView.worldToCanvas(worldPos);
+    }
+    getFrameOfReferenceUID() {
+        return this.viewReferences.getFrameOfReferenceUID();
+    }
+    hasImageId(imageId) {
+        return this.getImageIds().includes(imageId);
+    }
+    hasImageURI(imageURI) {
+        return this.getImageIds().some((imageId) => imageIdToURI(imageId) === imageURI);
+    }
+    hasVolumeId(volumeId) {
+        return this.getVolumeId() === volumeId;
+    }
+    hasVolumeURI(volumeURI) {
+        return String(this.getVolumeId() || '').includes(volumeURI);
+    }
+    isPlaneViewable(planeRestriction, options) {
+        return this.viewReferences.isPlaneViewable(planeRestriction, options);
+    }
+    isReferenceViewable(viewRef, options = {}) {
+        return super.isReferenceViewable(viewRef, options);
+    }
+    setImageIdIndex(imageIdIndex) {
+        const imageIds = this.getImageIds();
+        if (!imageIds.length) {
+            return Promise.reject(new Error('[PlanarViewport] Cannot set image index on empty stack'));
+        }
+        const clampedImageIdIndex = Math.min(Math.max(0, imageIdIndex), this.getMaxImageIdIndex());
+        const resolvedImageId = imageIds[clampedImageIdIndex] || imageIds[imageIds.length - 1];
+        const rendering = this.getCurrentPlanarRendering();
+        if (rendering?.renderMode === ActorRenderMode.CPU_VOLUME ||
+            rendering?.renderMode === ActorRenderMode.VTK_VOLUME_SLICE) {
+            const sliceWorldPoint = this.getVolumeSliceWorldPointForImageIdIndex(clampedImageIdIndex);
+            if (sliceWorldPoint) {
+                this.setViewState({
+                    slice: {
+                        kind: 'volumePoint',
+                        sliceWorldPoint,
+                    },
+                });
+            }
+            return Promise.resolve(resolvedImageId);
+        }
+        this.setViewState({
+            slice: {
+                kind: 'stackIndex',
+                imageIdIndex: clampedImageIdIndex,
+            },
+        });
+        return Promise.resolve(resolvedImageId);
+    }
+    scroll(delta) {
+        return this.setImageIdIndex(this.getActiveImageIdIndex() + delta);
+    }
+    setOrientation(orientation) {
+        this.setViewState({ orientation: this.resolveSetOrientation(orientation) });
+    }
+    resetViewState(options) {
+        const { resetPan = true, resetZoom = true, resetOrientation = true, resetFlip = true, } = options || {};
+        const nextCamera = {
+            rotation: 0,
+        };
+        if (resetPan) {
+            nextCamera.anchorWorld = undefined;
+            nextCamera.anchorCanvas = [0.5, 0.5];
+        }
+        if (resetZoom) {
+            nextCamera.scale = [1, 1];
+            nextCamera.scaleMode = 'fit';
+        }
+        if (resetOrientation) {
+            nextCamera.orientation = this.resolveRequestedOrientation();
+        }
+        if (resetFlip) {
+            nextCamera.flipHorizontal = false;
+            nextCamera.flipVertical = false;
+        }
+        this.setViewState(nextCamera);
+        this.triggerCameraResetEvent();
+        return true;
+    }
+    resetViewStateForResize() {
+        return this.resetViewState();
+    }
+    getUseCustomRenderingPipeline() {
+        return false;
+    }
+    setRendered() {
+        super.setRendered();
+    }
+    resize() {
+        if (this.isDestroyed) {
+            return;
+        }
+        this.clearResolvedViewCache();
+        const { clientHeight, clientWidth } = this.element;
+        const { canvas } = this.renderContext.cpu;
+        const devicePixelRatio = window.devicePixelRatio || 1;
+        const targetWidth = Math.round(clientWidth * devicePixelRatio);
+        const targetHeight = Math.round(clientHeight * devicePixelRatio);
+        if (canvas.width !== targetWidth || canvas.height !== targetHeight) {
+            canvas.width = targetWidth;
+            canvas.height = targetHeight;
+        }
+        this.resizeBindingsWithActiveFirst();
+    }
+    render() {
+        if (this.isDestroyed) {
+            return;
+        }
+        if (!this.bindings.size) {
+            this.viewportStatus = ViewportStatus.NO_DATA;
+            return;
+        }
+        this.setNeedsRender();
+        this.renderContext.cpu.composition.renderPassId += 1;
+        if (!this.renderBindings()) {
+            this.requestRenderingEngineRender();
+        }
+    }
+    onDestroy() {
+        this.clearResolvedViewCache();
+        if (this.renderImageObjectDataId) {
+            genericViewportDataSetMetadataProvider.remove(this.renderImageObjectDataId);
+            this.renderImageObjectDataId = undefined;
+        }
+        this.cpuCanvas?.remove();
+        this.cpuCanvas = undefined;
+        this.mountedData.clearActiveDataId();
+        this.renderContext.view.activeSourceICamera = undefined;
+    }
+    modified(previousCamera) {
+        if (this.isDestroyed) {
+            return;
+        }
+        this.updateBindingsCameraState();
+        this.render();
+        if (previousCamera) {
+            this.triggerCameraModifiedEvent(previousCamera);
+        }
+    }
+    renderBindings() {
+        if (this.isDestroyed) {
+            return false;
+        }
+        let renderedByAdapter = false;
+        const sourceBinding = this.getCurrentBinding();
+        sourceBinding?.render?.();
+        renderedByAdapter = renderedByAdapter || Boolean(sourceBinding?.render);
+        for (const binding of this.bindings.values()) {
+            if (binding === sourceBinding) {
+                continue;
+            }
+            binding.render?.();
+            renderedByAdapter = renderedByAdapter || Boolean(binding.render);
+        }
+        return renderedByAdapter;
+    }
+    requestRenderingEngineRender() {
+        const renderingEngine = renderingEngineCache.get(this.renderingEngineId);
+        if (renderingEngine) {
+            renderingEngine.renderViewport(this.id);
+        }
+    }
+    setRenderModeVisibility(renderMode, cpuCanvas, vtkCanvas) {
+        const useCPUCanvas = renderMode === ActorRenderMode.CPU_IMAGE ||
+            renderMode === ActorRenderMode.CPU_VOLUME;
+        const viewportElement = this.element.querySelector('.viewport-element');
+        cpuCanvas.style.display = useCPUCanvas ? '' : 'none';
+        cpuCanvas.style.pointerEvents = useCPUCanvas ? 'auto' : 'none';
+        vtkCanvas.style.display = useCPUCanvas ? 'none' : '';
+        if (viewportElement) {
+            viewportElement.style.pointerEvents = useCPUCanvas ? 'none' : '';
+        }
+    }
+    createLegacyCompatibilityHost() {
+        return {
+            getElement: () => this.element,
+            getViewportId: () => this.id,
+            getRequestedOrientation: () => this.resolveRequestedOrientation(),
+            prepareVolumeCompatibilityCamera: () => {
+                this.viewState = this.normalizeViewState({
+                    ...this.viewState,
+                    orientation: this.resolveRequestedOrientation(),
+                });
+            },
+            setDisplaySets: (...entries) => this.setDisplaySets(...entries),
+            setImageIdIndex: (imageIdIndex) => this.setImageIdIndex(imageIdIndex),
+            getCurrentImageId: () => this.getCurrentImageId(),
+            render: () => this.render(),
+            removeBindingsExcept: (keepDataIds) => this.removeBindingsExcept(keepDataIds),
+            setCameraOrientation: (orientation) => {
+                this.setViewState({
+                    orientation: this.resolveSetOrientation(orientation),
+                });
+            },
+            setDataPresentationState: (dataId, presentation) => {
+                this.setDataPresentationState(dataId, presentation);
+            },
+            setDisplaySetPresentation: (displaySetId, presentation) => {
+                this.setDisplaySetPresentation(displaySetId, presentation);
+            },
+            getDisplaySetPresentation: (dataId) => this.getDisplaySetPresentation(dataId),
+            getCameraOrientation: () => this.viewState.orientation,
+            getCurrentPlanarRendering: () => this.getCurrentPlanarRendering(),
+            getActiveDataId: () => this.mountedData.getActiveDataId(),
+            getFirstBoundDataId: () => this.mountedData.getFirstBoundDataId(),
+            findDataIdByVolumeId: (volumeId) => this.mountedData.findDataIdByVolumeId(volumeId),
+            getBindingActor: (dataId) => this.mountedData.getBindingActor(dataId),
+            getDefaultVOIRange: (dataId) => this.getDefaultVOIRange(dataId),
+            getImageCount: () => this.getImageIds().length,
+            getMaxImageIdIndex: () => this.getMaxImageIdIndex(),
+        };
+    }
+    updateBindingsCameraState() {
+        const currentBinding = this.getCurrentBinding();
+        if (currentBinding) {
+            currentBinding.applyViewState(this.viewState);
+        }
+        else {
+            this.renderContext.view.activeSourceICamera = undefined;
+        }
+        this.forEachBinding((binding) => {
+            if (binding !== currentBinding) {
+                binding.applyViewState(this.viewState);
+            }
+        });
+    }
+    resizeBindingsWithActiveFirst() {
+        const currentBinding = this.getCurrentBinding();
+        currentBinding?.resize?.();
+        this.forEachBinding((binding) => {
+            if (binding !== currentBinding) {
+                binding.resize?.();
+            }
+        });
+    }
+    getActiveImageIdIndex() {
+        const binding = this.getCurrentBinding();
+        const currentImageIdIndex = binding?.rendering?.currentImageIdIndex;
+        if (typeof currentImageIdIndex === 'number') {
+            return currentImageIdIndex;
+        }
+        return this.viewState.slice?.kind === 'stackIndex'
+            ? this.viewState.slice.imageIdIndex
+            : 0;
+    }
+    getMaxImageIdIndex() {
+        const binding = this.getCurrentBinding();
+        const maxImageIdIndex = binding?.rendering?.maxImageIdIndex;
+        if (typeof maxImageIdIndex === 'number') {
+            return maxImageIdIndex;
+        }
+        return Math.max(0, this.getImageIds().length - 1);
+    }
+    getVolumeSliceWorldPointForImageIdIndex(imageIdIndex) {
+        const sliceBasis = this.getResolvedView({
+            sliceIndex: imageIdIndex,
+        })?.getSliceBasis();
+        const sliceWorldPoint = sliceBasis?.sliceCenterWorld;
+        return sliceWorldPoint ? [...sliceWorldPoint] : undefined;
+    }
+    getPlanarData() {
+        return this.getCurrentPlanarData();
+    }
+    getCurrentBinding() {
+        return this.mountedData.getCurrentBinding();
+    }
+    getDataSet(dataId) {
+        const dataSet = getGenericViewportImageDataSet(dataId);
+        if (!isPlanarRegisteredDataSet(dataSet)) {
+            return;
+        }
+        return dataSet;
+    }
+    async loadPlanarData(dataId, options) {
+        const dataSet = this.getDataSet(dataId);
+        if (!dataSet) {
+            throw new Error(`[PlanarViewport] No registered planar dataset metadata for ${dataId}`);
+        }
+        const resolvedOrientation = this.resolveRequestedOrientation(options.orientation);
+        const selectedPath = selectPlanarRenderPath(dataSet, {
+            orientation: resolvedOrientation,
+            cpuThresholds: options.cpuThresholds,
+        });
+        const data = await this.dataProvider.load(dataId, {
+            acquisitionOrientation: selectedPath.acquisitionOrientation,
+            orientation: resolvedOrientation,
+            renderMode: selectedPath.renderMode,
+            volumeId: selectedPath.volumeId,
+        });
+        return {
+            data,
+            selectedPath,
+            resolvedOrientation,
+        };
+    }
+    applyLoadedPlanarViewState(resolvedOrientation, planarData, selectedPath) {
+        const isVolumePath = selectedPath.renderMode === ActorRenderMode.CPU_VOLUME ||
+            selectedPath.renderMode === ActorRenderMode.VTK_VOLUME_SLICE;
+        const orientation = normalizePlanarOrientation(resolvedOrientation, selectedPath.acquisitionOrientation);
+        const slice = isVolumePath
+            ? this.createInitialVolumeSliceState(planarData, selectedPath.renderMode, orientation)
+            : {
+                kind: 'stackIndex',
+                imageIdIndex: planarData.initialImageIdIndex,
+            };
+        this.clearResolvedViewCache();
+        this.viewState = this.normalizeViewState({
+            ...this.viewState,
+            slice,
+            orientation,
+        });
+    }
+    createInitialVolumeSliceState(planarData, renderMode, orientation) {
+        if (!planarData.imageVolume) {
+            return;
+        }
+        const { height, width } = this.getCurrentCanvasDimensions();
+        const createSliceBasis = renderMode === ActorRenderMode.CPU_VOLUME
+            ? createPlanarCpuVolumeSliceBasis
+            : createPlanarVolumeSliceBasis;
+        const initialImageIdIndex = orientation === OrientationAxis.ACQUISITION
+            ? planarData.initialImageIdIndex
+            : undefined;
+        const { sliceBasis } = createSliceBasis({
+            canvasHeight: height,
+            canvasWidth: width,
+            imageIdIndex: initialImageIdIndex,
+            imageVolume: planarData.imageVolume,
+            orientation,
+        });
+        return {
+            kind: 'volumePoint',
+            sliceWorldPoint: [...sliceBasis.sliceCenterWorld],
+        };
+    }
+    resolveRequestedOrientation(orientation) {
+        return (clonePlanarOrientation((orientation ??
+            this.defaultOptions
+                .orientation) ||
+            OrientationAxis.ACQUISITION) || OrientationAxis.ACQUISITION);
+    }
+    resolveSetOrientation(orientation) {
+        if (typeof orientation !== 'string') {
+            return clonePlanarOrientation(orientation) || OrientationAxis.ACQUISITION;
+        }
+        if (!isReformatOrientation(orientation)) {
+            return orientation;
+        }
+        const baseOrientation = getBaseReformatOrientation(orientation);
+        const cameraVectors = getCameraVectors({
+            getActors: () => this.getActors(),
+            getCamera: () => this.getCameraForEvent(),
+            getCurrentImageId: () => this.getCurrentImageId(),
+            getImageIds: () => this.getImageIds(),
+            type: ViewportType.ORTHOGRAPHIC,
+        }, {
+            useViewportNormal: true,
+            ...(baseOrientation ? { orientation: baseOrientation } : {}),
+        });
+        if (cameraVectors) {
+            return {
+                viewPlaneNormal: cameraVectors.viewPlaneNormal,
+                viewUp: cameraVectors.viewUp,
+            };
+        }
+        return baseOrientation || this.viewState.orientation;
+    }
+    removeBindingsExcept(keepDataIds) {
+        this.mountedData.removeBindingsExcept(keepDataIds);
+    }
+    resolveStackInputImage(stackInput) {
+        const cachedImage = cache.getImage(stackInput.imageId);
+        if (cachedImage) {
+            return cachedImage;
+        }
+        if (!stackInput.imageData) {
+            return;
+        }
+        return createPlanarImageFromVTKImageData(stackInput.imageId, stackInput.imageData);
+    }
+    resolveOverlayReference(stackInput, image) {
+        const reference = stackInput.reference;
+        if (reference && typeof reference.kind === 'string') {
+            return reference;
+        }
+        return {
+            kind: 'image',
+            imageId: image.imageId,
+        };
+    }
+    resolveOverlayDataId(stackInput, image, reference) {
+        const explicitDataId = stackInput.dataId;
+        if (typeof explicitDataId === 'string') {
+            return explicitDataId;
+        }
+        if (reference.kind === 'segmentation' &&
+            typeof reference.representationUID === 'string') {
+            return reference.representationUID;
+        }
+        const baseDataId = image.imageId;
+        if (!this.mountedData.hasBinding(baseDataId)) {
+            return baseDataId;
+        }
+        return `overlay:${baseDataId}`;
+    }
+    findBindingDataIdByActorEntryUID(actorEntryUID) {
+        return this.mountedData.findBindingDataIdByActorEntryUID(actorEntryUID);
+    }
+    findDataIdByVolumeId(volumeId) {
+        return this.mountedData.findDataIdByVolumeId(volumeId);
+    }
+    getCurrentPlanarRendering() {
+        return this.getCurrentBinding()?.rendering;
+    }
+    resolveViewState(viewState, args = {}) {
+        const data = this.getPlanarData();
+        const rendering = this.getCurrentPlanarRendering();
+        return resolvePlanarViewportView({
+            viewState,
+            data,
+            frameOfReferenceUID: args.frameOfReferenceUID ?? this.resolveFrameOfReferenceUID(),
+            renderContext: this.renderContext,
+            rendering,
+            sliceIndex: args.sliceIndex,
+        });
+    }
+    getProjectionSnapshot() {
+        const { height: canvasHeight, width: canvasWidth } = this.getCurrentCanvasDimensions();
+        const snapshot = getPlanarProjectionSnapshot({
+            viewport: this,
+            canvasHeight,
+            canvasWidth,
+            displayArea: this.getDisplayArea(),
+            frameOfReferenceUID: this.resolveFrameOfReferenceUID(),
+            resolvedView: this.getResolvedView(),
+            resolveViewState: (viewState) => this.resolveViewState(viewState),
+            viewState: this.viewState,
+        });
+        if (!snapshot) {
+            throw new Error('[PlanarViewport] Unable to resolve projection snapshot');
+        }
+        return snapshot;
+    }
+    resolveCachedViewState(viewState, args = {}) {
+        if (args.frameOfReferenceUID || typeof args.sliceIndex === 'number') {
+            return this.resolveViewState(viewState, args);
+        }
+        const data = this.getPlanarData();
+        const rendering = this.getCurrentPlanarRendering();
+        const activeDataId = this.mountedData.getActiveDataId();
+        const frameOfReferenceUID = this.resolveFrameOfReferenceUID();
+        const cache = this.resolvedViewCache;
+        if (!rendering) {
+            return this.resolveViewState(viewState, args);
+        }
+        const { canvasHeight, canvasWidth } = getPlanarViewStateCanvasDimensions({
+            renderContext: this.renderContext,
+            rendering,
+        });
+        if (cache &&
+            cache.activeDataId === activeDataId &&
+            cache.viewState === viewState &&
+            cache.data === data &&
+            cache.rendering === rendering &&
+            cache.frameOfReferenceUID === frameOfReferenceUID &&
+            cache.canvasHeight === canvasHeight &&
+            cache.canvasWidth === canvasWidth &&
+            cache.revision === this.resolvedViewCacheRevision) {
+            return cache.resolvedView;
+        }
+        const resolvedView = resolvePlanarViewportView({
+            viewState,
+            data,
+            frameOfReferenceUID,
+            renderContext: this.renderContext,
+            rendering,
+            canvasDimensions: {
+                canvasHeight,
+                canvasWidth,
+            },
+        });
+        if (resolvedView) {
+            this.resolvedViewCache = {
+                activeDataId,
+                canvasHeight,
+                canvasWidth,
+                data,
+                frameOfReferenceUID,
+                rendering,
+                resolvedView,
+                revision: this.resolvedViewCacheRevision,
+                viewState,
+            };
+        }
+        return resolvedView;
+    }
+    clearResolvedViewCache() {
+        this.resolvedViewCache = undefined;
+        this.resolvedViewCacheRevision += 1;
+    }
+    resolveFrameOfReferenceUID() {
+        return this.viewReferences.resolveFrameOfReferenceUID();
+    }
+    getFallbackPan(viewState = this.viewState) {
+        const anchorCanvas = viewState.anchorCanvas ?? [0.5, 0.5];
+        const anchorWorld = viewState.anchorWorld ?? [0, 0, 0];
+        const { height, width } = this.getCurrentCanvasDimensions();
+        const [scaleX, scaleY] = normalizePlanarScale(viewState.scale);
+        return [
+            (0 - anchorWorld[0]) * scaleX + (anchorCanvas[0] - 0.5) * width,
+            (0 - anchorWorld[1]) * scaleY + (anchorCanvas[1] - 0.5) * height,
+        ];
+    }
+    getFallbackViewStateWithPan(viewState, nextPan) {
+        const currentPan = this.getFallbackPan(viewState);
+        const [ax, ay] = viewState.anchorCanvas ?? [0.5, 0.5];
+        const { height: canvasHeight, width: canvasWidth } = this.getCurrentCanvasDimensions();
+        const deltaX = nextPan[0] - currentPan[0];
+        const deltaY = nextPan[1] - currentPan[1];
+        return this.normalizeViewState({
+            ...viewState,
+            anchorCanvas: [
+                ax + deltaX / Math.max(canvasWidth, 1),
+                ay + deltaY / Math.max(canvasHeight, 1),
+            ],
+            displayArea: undefined,
+        });
+    }
+    buildFallbackCanvasToWorld(canvasPos) {
+        const anchorCanvas = this.viewState.anchorCanvas ?? [0.5, 0.5];
+        const anchorWorld = this.viewState.anchorWorld ?? [0, 0, 0];
+        const { height, width } = this.getCurrentCanvasDimensions();
+        const [scaleX, scaleY] = normalizePlanarScale(this.viewState.scale);
+        return [
+            anchorWorld[0] + (canvasPos[0] - anchorCanvas[0] * width) / scaleX,
+            anchorWorld[1] + (canvasPos[1] - anchorCanvas[1] * height) / scaleY,
+            anchorWorld[2],
+        ];
+    }
+    buildFallbackWorldToCanvas(worldPos) {
+        const anchorCanvas = this.viewState.anchorCanvas ?? [0.5, 0.5];
+        const anchorWorld = this.viewState.anchorWorld ?? [0, 0, 0];
+        const { height, width } = this.getCurrentCanvasDimensions();
+        const [scaleX, scaleY] = normalizePlanarScale(this.viewState.scale);
+        return [
+            (worldPos[0] - anchorWorld[0]) * scaleX + anchorCanvas[0] * width,
+            (worldPos[1] - anchorWorld[1]) * scaleY + anchorCanvas[1] * height,
+        ];
+    }
+    applyResolvedViewState(nextCamera) {
+        const previousCamera = this.getResolvedCameraForEvent();
+        this.clearResolvedViewCache();
+        this.viewState = this.normalizeViewState(nextCamera);
+        this.modified(previousCamera);
+    }
+    getResolvedCameraForEvent() {
+        return this.getResolvedView()?.toICamera();
+    }
+    getCameraForEvent() {
+        const resolvedView = this.getResolvedView();
+        if (resolvedView) {
+            return resolvedView.toICamera();
+        }
+        return this.getViewState();
+    }
+    getCurrentPresentation() {
+        const resolvedView = this.getResolvedView();
+        if (!resolvedView) {
+            return;
+        }
+        return {
+            flipHorizontal: resolvedView.state.viewState.flipHorizontal === true,
+            flipVertical: resolvedView.state.viewState.flipVertical === true,
+            pan: resolvedView.pan,
+            rotation: resolvedView.rotation,
+            scale: resolvedView.scale,
+            zoom: resolvedView.zoom,
+        };
+    }
+    getCurrentCanvasDimensions() {
+        const rendering = this.getCurrentPlanarRendering();
+        if (rendering) {
+            const { canvasHeight, canvasWidth } = getPlanarViewStateCanvasDimensions({
+                renderContext: this.renderContext,
+                rendering,
+            });
+            return {
+                width: canvasWidth || this.element.clientWidth,
+                height: canvasHeight || this.element.clientHeight,
+            };
+        }
+        return {
+            width: this.element.clientWidth,
+            height: this.element.clientHeight,
+        };
+    }
+    getCurrentPlanarData() {
+        return this.getCurrentBinding()?.data;
+    }
+    getReferenceViewContexts() {
+        return this.viewReferences.getReferenceViewContexts(super.getReferenceViewContexts());
+    }
+}
+function cloneViewportOptions(options = {}) {
+    return deepClone(options);
+}
+function getBaseReformatOrientation(orientation) {
+    switch (orientation) {
+        case OrientationAxis.AXIAL_REFORMAT:
+            return OrientationAxis.AXIAL;
+        case OrientationAxis.CORONAL_REFORMAT:
+            return OrientationAxis.CORONAL;
+        case OrientationAxis.SAGITTAL_REFORMAT:
+            return OrientationAxis.SAGITTAL;
+        default:
+            return;
+    }
+}
+function isReformatOrientation(orientation) {
+    return (orientation === OrientationAxis.REFORMAT ||
+        orientation === OrientationAxis.AXIAL_REFORMAT ||
+        orientation === OrientationAxis.CORONAL_REFORMAT ||
+        orientation === OrientationAxis.SAGITTAL_REFORMAT);
+}
+function createPlanarImageFromVTKImageData(imageId, imageData) {
+    const dimensions = imageData.getDimensions();
+    const spacing = imageData.getSpacing();
+    const columns = dimensions[0] ?? 1;
+    const rows = dimensions[1] ?? 1;
+    const columnPixelSpacing = spacing[0] ?? 1;
+    const rowPixelSpacing = spacing[1] ?? 1;
+    const scalars = imageData.getPointData().getScalars();
+    const scalarData = scalars.getData();
+    const scalarRange = scalarData.length
+        ? getMinMax(scalarData)
+        : { min: 0, max: 1 };
+    const { min, max } = Number.isFinite(scalarRange.min) && Number.isFinite(scalarRange.max)
+        ? scalarRange
+        : { min: 0, max: 1 };
+    const windowWidth = Math.max(max - min, 1);
+    const dataType = scalarData.constructor?.name || 'Uint8Array';
+    return {
+        imageId,
+        minPixelValue: min,
+        maxPixelValue: max,
+        slope: 1,
+        intercept: 0,
+        windowCenter: min + windowWidth / 2,
+        windowWidth,
+        voiLUTFunction: VOILUTFunctionType.LINEAR,
+        getPixelData: () => scalarData,
+        getCanvas: () => {
+            const canvas = document.createElement('canvas');
+            canvas.width = columns;
+            canvas.height = rows;
+            return canvas;
+        },
+        rows,
+        columns,
+        height: rows,
+        width: columns,
+        color: false,
+        rgba: false,
+        numberOfComponents: scalars.getNumberOfComponents?.() ?? 1,
+        columnPixelSpacing,
+        rowPixelSpacing,
+        invert: false,
+        photometricInterpretation: 'MONOCHROME2',
+        sizeInBytes: scalarData.byteLength ??
+            scalarData.length * 4,
+        dataType: dataType,
+    };
+}
+function isPlanarRegisteredDataSet(value) {
+    if (!isGenericViewportImageDataSet(value) || value.imageIds.length === 0) {
+        return false;
+    }
+    return ((value.initialImageIdIndex === undefined ||
+        typeof value.initialImageIdIndex === 'number') &&
+        (value.volumeId === undefined || typeof value.volumeId === 'string'));
+}
+export default PlanarViewport;