@cornerstonejs/core 3.30.3 → 3.31.1

package/dist/esm/RenderingEngine/BaseRenderingEngine.js

@@ -8,9 +8,10 @@ import BaseVolumeViewport from './BaseVolumeViewport';
 import StackViewport from './StackViewport';
 import viewportTypeUsesCustomRenderingPipeline from './helpers/viewportTypeUsesCustomRenderingPipeline';
 import getOrCreateCanvas from './helpers/getOrCreateCanvas';
-import { getShouldUseCPURendering, isCornerstoneInitialized } from '../init';
+import { getShouldUseCPURendering, isCornerstoneInitialized, getConfiguration, } from '../init';
 import viewportTypeToViewportClass from './helpers/viewportTypeToViewportClass';
 import { OrientationAxis } from '../enums';
+import { StatsOverlay } from './helpers/stats';
 export const VIEWPORT_MIN_SIZE = 2;
 class BaseRenderingEngine {
     constructor(id) {
@@ -34,6 +35,10 @@ class BaseRenderingEngine {
         }
         this._viewports = new Map();
         this.hasBeenDestroyed = false;
+        const config = getConfiguration();
+        if (config?.debug?.statsOverlay) {
+            StatsOverlay.setup();
+        }
     }
     enableElement(viewportInputEntry) {
         const viewportInput = this._normalizeViewportInputEntry(viewportInputEntry);
@@ -169,6 +174,7 @@ class BaseRenderingEngine {
         if (this.hasBeenDestroyed) {
             return;
         }
+        StatsOverlay.cleanup();
         if (!this.useCPURendering) {
             const viewports = this._getViewportsAsArray();
             viewports.forEach((vp) => {

package/dist/esm/RenderingEngine/BaseVolumeViewport.d.ts

@@ -2,7 +2,7 @@ import type { mat4 } from 'gl-matrix';
 import type { BlendModes, InterpolationType, OrientationAxis } from '../enums';
 import type { FlipDirection, IImageData, IVolumeInput, OrientationVectors, Point2, Point3, VolumeViewportProperties, ViewReferenceSpecifier, ReferenceCompatibleOptions, ViewReference, ICamera } from '../types';
 import type { VoiModifiedEventDetail } from '../types/EventTypes';
-import type { ViewportInput } from '../types/IViewport';
+import type { PlaneRestriction, ViewportInput } from '../types/IViewport';
 import type { TransferFunctionNodes } from '../types/ITransferFunctionNode';
 import Viewport from './Viewport';
 import type vtkRenderer from '@kitware/vtk.js/Rendering/Core/Renderer';
@@ -43,6 +43,7 @@ declare abstract class BaseVolumeViewport extends Viewport {
     isReferenceViewable(viewRef: ViewReference, options?: ReferenceCompatibleOptions): boolean;
     scroll(delta?: number): void;
     abstract isInAcquisitionPlane(): boolean;
+    setViewPlane(planeRestriction: PlaneRestriction, viewPlaneNormal: any): void;
     setViewReference(viewRef: ViewReference): void;
     private setThreshold;
     setProperties({ voiRange, VOILUTFunction, invert, colormap, preset, interpolationType, slabThickness, }?: VolumeViewportProperties, volumeId?: string, suppressEvents?: boolean): void;
@@ -78,6 +79,7 @@ declare abstract class BaseVolumeViewport extends Viewport {
     getRendererContextPool(): vtkRenderer;
     getRendererTiled(): vtkRenderer;
     hasImageURI: (imageURI: string) => boolean;
+    protected _getViewUp(viewPlaneNormal: any): Point3;
     protected _getOrientationVectors(orientation: OrientationAxis | OrientationVectors): OrientationVectors;
     protected _getAcquisitionPlaneOrientation(): OrientationVectors;
     getSlabThickness(): number;

package/dist/esm/RenderingEngine/BaseVolumeViewport.js

@@ -23,7 +23,7 @@ import getVolumeViewportScrollInfo from '../utilities/getVolumeViewportScrollInf
 import { actorIsA, isImageActor } from '../utilities/actorCheck';
 import snapFocalPointToSlice from '../utilities/snapFocalPointToSlice';
 import getVoiFromSigmoidRGBTransferFunction from '../utilities/getVoiFromSigmoidRGBTransferFunction';
-import isEqual, { isEqualNegative } from '../utilities/isEqual';
+import isEqual, { isEqualAbs, isEqualNegative } from '../utilities/isEqual';
 import applyPreset from '../utilities/applyPreset';
 import imageIdToURI from '../utilities/imageIdToURI';
 import uuidv4 from '../utilities/uuidv4';
@@ -257,11 +257,11 @@ class BaseVolumeViewport extends Viewport {
             const volumeActors = this.getActors().filter((actorEntry) => actorIsA(actorEntry, 'vtkVolume'));
             return volumeActors.some(({ uid, referencedId }) => {
                 const volume = cache.getVolume(referencedId || uid);
-                if (!volume?.imageIds) {
+                if (!volume?.getImageIdIndex) {
                     return false;
                 }
-                const volumeImageURIs = volume.imageIds.map(imageIdToURI);
-                return volumeImageURIs.includes(imageURI);
+                return (volume.getImageIdIndex(imageURI) !== undefined ||
+                    volume.getImageURIIndex(imageURI) !== undefined);
             });
         };
         this.getImageIds = (volumeId) => {
@@ -580,7 +580,8 @@ class BaseVolumeViewport extends Viewport {
             return false;
         }
         if (options?.withNavigation) {
-            return true;
+            const { referencedImageId } = viewRef;
+            return !referencedImageId || this.hasImageURI(referencedImageId);
         }
         const currentSliceIndex = this.getSliceIndex();
         const { sliceIndex } = viewRef;
@@ -604,14 +605,50 @@ class BaseVolumeViewport extends Viewport {
         });
         this.render();
     }
+    setViewPlane(planeRestriction, viewPlaneNormal) {
+        const { point, inPlaneVector1, inPlaneVector2, FrameOfReferenceUID } = planeRestriction;
+        if (!inPlaneVector1) {
+            return this.setViewReference({
+                FrameOfReferenceUID,
+                cameraFocalPoint: point,
+            });
+        }
+        if (inPlaneVector2) {
+            const planeNormal = (vec3.cross(vec3.create(), inPlaneVector1, inPlaneVector2));
+            vec3.normalize(planeNormal, planeNormal);
+            return this.setViewReference({
+                FrameOfReferenceUID,
+                cameraFocalPoint: point,
+                viewPlaneNormal: planeNormal,
+            });
+        }
+        const dotNormal = vec3.dot(viewPlaneNormal, inPlaneVector1);
+        if (isEqual(dotNormal, 0)) {
+            return this.setViewReference({
+                FrameOfReferenceUID,
+                viewPlaneNormal,
+                cameraFocalPoint: point,
+            });
+        }
+        const planeNormal = (vec3.cross(vec3.create(), viewPlaneNormal, inPlaneVector1));
+        vec3.normalize(planeNormal, planeNormal);
+        return this.setViewReference({
+            FrameOfReferenceUID,
+            viewPlaneNormal: planeNormal,
+            cameraFocalPoint: point,
+        });
+    }
     setViewReference(viewRef) {
         if (!viewRef) {
             return;
         }
         const volumeId = this.getVolumeId();
-        const { viewPlaneNormal: refViewPlaneNormal, FrameOfReferenceUID: refFrameOfReference, cameraFocalPoint, referencedImageId, viewUp, } = viewRef;
+        const { FrameOfReferenceUID: refFrameOfReference, cameraFocalPoint, referencedImageId, planeRestriction, viewPlaneNormal: refViewPlaneNormal, viewUp, } = viewRef;
         let { sliceIndex } = viewRef;
         const { focalPoint, viewPlaneNormal, position } = this.getCamera();
+        if (planeRestriction?.inPlaneVector1 && !refViewPlaneNormal) {
+            return this.setViewPlane(planeRestriction, viewPlaneNormal);
+        }
         const isNegativeNormal = isEqualNegative(viewPlaneNormal, refViewPlaneNormal);
         const isSameNormal = isEqual(viewPlaneNormal, refViewPlaneNormal);
         if (typeof sliceIndex === 'number' &&
@@ -969,13 +1006,35 @@ class BaseVolumeViewport extends Viewport {
         }
         return renderingEngine.offscreenMultiRenderWindow?.getRenderer(this.id);
     }
+    _getViewUp(viewPlaneNormal) {
+        const { viewUp } = this.getCamera();
+        const dot = vec3.dot(viewUp, viewPlaneNormal);
+        if (isEqual(dot, 0)) {
+            return viewUp;
+        }
+        if (isEqualAbs(viewPlaneNormal[0], 1)) {
+            return [0, 0, 1];
+        }
+        if (isEqualAbs(viewPlaneNormal[1], 1)) {
+            return [0, 0, 1];
+        }
+        if (isEqualAbs(viewPlaneNormal[2], 1)) {
+            return [0, -1, 0];
+        }
+        const vupOrthogonal = (vec3.scaleAndAdd(vec3.create(), viewUp, viewPlaneNormal, -dot));
+        vec3.normalize(vupOrthogonal, vupOrthogonal);
+        return vupOrthogonal;
+    }
     _getOrientationVectors(orientation) {
         if (typeof orientation === 'object') {
-            if (orientation.viewPlaneNormal && orientation.viewUp) {
-                return orientation;
+            if (orientation.viewPlaneNormal) {
+                return {
+                    ...orientation,
+                    viewUp: orientation.viewUp || this._getViewUp(orientation.viewPlaneNormal),
+                };
             }
             else {
-                throw new Error('Invalid orientation object. It must contain viewPlaneNormal and viewUp');
+                throw new Error('Invalid orientation object. It must contain viewPlaneNormal');
             }
         }
         else if (typeof orientation === 'string') {

package/dist/esm/RenderingEngine/StackViewport.js

@@ -1794,10 +1794,13 @@ class StackViewport extends Viewport {
                 this.imageKeyToIndexMap.get(multiSliceReference.referencedImageId);
             return testIndex <= rangeEndSliceIndex && testIndex >= foundSliceIndex;
         }
-        if (!super.isReferenceViewable(viewRef, options)) {
+        if (!super.isReferenceViewable(viewRef, {
+            ...options,
+            withOrientation: options?.asVolume,
+        })) {
             return false;
         }
-        if (viewRef.volumeId) {
+        if (viewRef.volumeId || viewRef.FrameOfReferenceUID) {
             return options.asVolume;
         }
         const { cameraFocalPoint } = viewRef;

package/dist/esm/RenderingEngine/VideoViewport.js

@@ -574,7 +574,7 @@ class VideoViewport extends Viewport {
         }
     }
     getCurrentImageId(index = this.getCurrentImageIdIndex()) {
-        const current = this.imageId.replace('/frames/1', `/frames/${index + 1}`);
+        const current = this.imageId?.replace('/frames/1', `/frames/${index + 1}`);
         return current;
     }
     getViewReferenceId(specifier = {}) {

package/dist/esm/RenderingEngine/Viewport.d.ts

@@ -4,7 +4,7 @@ import type { mat4 } from 'gl-matrix';
 import ViewportStatus from '../enums/ViewportStatus';
 import ViewportType from '../enums/ViewportType';
 import type { ICamera, ActorEntry, IRenderingEngine, ViewportInputOptions, Point2, Point3, FlipDirection, DisplayArea, ViewPresentation, ViewReference, ViewportProperties, ImageActor } from '../types';
-import type { ViewportInput, ViewReferenceSpecifier, ReferenceCompatibleOptions, ViewPresentationSelector, DataSetOptions } from '../types/IViewport';
+import type { ViewportInput, ViewReferenceSpecifier, ReferenceCompatibleOptions, ViewPresentationSelector, DataSetOptions, PlaneRestriction } from '../types/IViewport';
 import type { vtkSlabCamera } from './vtkClasses/vtkSlabCamera';
 import type IImageCalibration from '../types/IImageCalibration';
 import { InterpolationType } from '../enums';
@@ -121,6 +121,7 @@ declare class Viewport {
     getClippingPlanesForActor(actorEntry?: ActorEntry): vtkPlane[];
     private _getWorldDistanceViewUpAndViewRight;
     getViewReference(viewRefSpecifier?: ViewReferenceSpecifier): ViewReference;
+    isPlaneViewable(planeRestriction: PlaneRestriction, options?: ReferenceCompatibleOptions): boolean;
     isReferenceViewable(viewRef: ViewReference, options?: ReferenceCompatibleOptions): boolean;
     getViewPresentation(viewPresSel?: ViewPresentationSelector): ViewPresentation;
     setViewReference(viewRef: ViewReference): void;

package/dist/esm/RenderingEngine/Viewport.js

@@ -14,6 +14,7 @@ import hasNaNValues from '../utilities/hasNaNValues';
 import { RENDERING_DEFAULTS } from '../constants';
 import { InterpolationType } from '../enums';
 import { deepClone } from '../utilities/deepClone';
+import { updatePlaneRestriction } from '../utilities/updatePlaneRestriction';
 class Viewport {
     static { this.CameraViewPresentation = {
         rotation: true,
@@ -906,16 +907,52 @@ class Viewport {
     }
     getViewReference(viewRefSpecifier) {
         const { focalPoint: cameraFocalPoint, viewPlaneNormal, viewUp, } = this.getCamera();
+        const FrameOfReferenceUID = this.getFrameOfReferenceUID();
         const target = {
-            FrameOfReferenceUID: this.getFrameOfReferenceUID(),
+            FrameOfReferenceUID,
             cameraFocalPoint,
             viewPlaneNormal,
             viewUp,
             sliceIndex: viewRefSpecifier?.sliceIndex ?? this.getSliceIndex(),
+            planeRestriction: {
+                FrameOfReferenceUID,
+                point: viewRefSpecifier?.points?.[0] || cameraFocalPoint,
+                inPlaneVector1: viewUp,
+                inPlaneVector2: (vec3.cross(vec3.create(), viewUp, viewPlaneNormal)),
+            },
         };
+        if (viewRefSpecifier?.points) {
+            updatePlaneRestriction(viewRefSpecifier.points, target.planeRestriction);
+        }
         return target;
     }
+    isPlaneViewable(planeRestriction, options) {
+        if (planeRestriction.FrameOfReferenceUID !== this.getFrameOfReferenceUID()) {
+            return false;
+        }
+        const { focalPoint, viewPlaneNormal } = this.getCamera();
+        const { point, inPlaneVector1, inPlaneVector2 } = planeRestriction;
+        if (options?.withOrientation) {
+            return true;
+        }
+        if (inPlaneVector1 &&
+            !isEqual(0, vec3.dot(viewPlaneNormal, inPlaneVector1))) {
+            return false;
+        }
+        if (inPlaneVector2 &&
+            !isEqual(0, vec3.dot(viewPlaneNormal, inPlaneVector2))) {
+            return false;
+        }
+        if (options?.withNavigation) {
+            return true;
+        }
+        const pointVector = vec3.sub(vec3.create(), point, focalPoint);
+        return isEqual(0, vec3.dot(pointVector, viewPlaneNormal));
+    }
     isReferenceViewable(viewRef, options) {
+        if (viewRef.planeRestriction) {
+            return this.isPlaneViewable(viewRef.planeRestriction, options);
+        }
         if (viewRef.FrameOfReferenceUID &&
             viewRef.FrameOfReferenceUID !== this.getFrameOfReferenceUID()) {
             return false;

package/dist/esm/RenderingEngine/helpers/stats/StatsOverlay.d.ts

@@ -0,0 +1,28 @@
+import type { StatsInstance } from './types';
+export declare class StatsOverlay implements StatsInstance {
+    private static instance;
+    dom: HTMLDivElement | null;
+    private currentMode;
+    private startTime;
+    private lastUpdateTime;
+    private frameCount;
+    private panels;
+    private animationFrameId;
+    private isSetup;
+    private constructor();
+    static getInstance(): StatsOverlay;
+    setup(): void;
+    cleanup(): void;
+    showPanel(panelType: number): void;
+    update(): void;
+    private createOverlayElement;
+    private applyOverlayStyles;
+    private handleClick;
+    private initializePanels;
+    private isMemoryAvailable;
+    private addPanel;
+    private startLoop;
+    private stopLoop;
+    private updateStats;
+    private updateMemoryPanel;
+}

package/dist/esm/RenderingEngine/helpers/stats/StatsOverlay.js

@@ -0,0 +1,137 @@
+import { StatsPanel } from './StatsPanel';
+import { PanelType } from './enums';
+import { STATS_CONFIG, PANEL_CONFIGS, CONVERSION } from './constants';
+export class StatsOverlay {
+    static { this.instance = null; }
+    constructor() {
+        this.dom = null;
+        this.currentMode = 0;
+        this.startTime = 0;
+        this.lastUpdateTime = 0;
+        this.frameCount = 0;
+        this.panels = new Map();
+        this.animationFrameId = null;
+        this.isSetup = false;
+    }
+    static getInstance() {
+        if (!StatsOverlay.instance) {
+            StatsOverlay.instance = new StatsOverlay();
+        }
+        return StatsOverlay.instance;
+    }
+    setup() {
+        if (this.isSetup) {
+            return;
+        }
+        try {
+            this.dom = this.createOverlayElement();
+            this.startTime = performance.now();
+            this.lastUpdateTime = this.startTime;
+            this.initializePanels();
+            this.showPanel(PanelType.FPS);
+            this.applyOverlayStyles();
+            document.body.appendChild(this.dom);
+            this.startLoop();
+            this.isSetup = true;
+        }
+        catch (error) {
+            console.warn('Failed to setup stats overlay:', error);
+        }
+    }
+    cleanup() {
+        this.stopLoop();
+        if (this.dom && this.dom.parentNode) {
+            this.dom.parentNode.removeChild(this.dom);
+        }
+        this.dom = null;
+        this.panels.clear();
+        this.isSetup = false;
+    }
+    showPanel(panelType) {
+        const children = Array.from(this.dom.children);
+        children.forEach((child, index) => {
+            child.style.display = index === panelType ? 'block' : 'none';
+        });
+        this.currentMode = panelType;
+    }
+    update() {
+        this.startTime = this.updateStats();
+    }
+    createOverlayElement() {
+        const element = document.createElement('div');
+        element.addEventListener('click', this.handleClick.bind(this), false);
+        return element;
+    }
+    applyOverlayStyles() {
+        Object.assign(this.dom.style, STATS_CONFIG.OVERLAY_STYLES);
+    }
+    handleClick(event) {
+        event.preventDefault();
+        const panelCount = this.dom.children.length;
+        this.showPanel((this.currentMode + 1) % panelCount);
+    }
+    initializePanels() {
+        const fpsPanel = new StatsPanel(PANEL_CONFIGS[PanelType.FPS].name, PANEL_CONFIGS[PanelType.FPS].foregroundColor, PANEL_CONFIGS[PanelType.FPS].backgroundColor);
+        this.addPanel(PanelType.FPS, fpsPanel);
+        const msPanel = new StatsPanel(PANEL_CONFIGS[PanelType.MS].name, PANEL_CONFIGS[PanelType.MS].foregroundColor, PANEL_CONFIGS[PanelType.MS].backgroundColor);
+        this.addPanel(PanelType.MS, msPanel);
+        if (this.isMemoryAvailable()) {
+            const memPanel = new StatsPanel(PANEL_CONFIGS[PanelType.MEMORY].name, PANEL_CONFIGS[PanelType.MEMORY].foregroundColor, PANEL_CONFIGS[PanelType.MEMORY].backgroundColor);
+            this.addPanel(PanelType.MEMORY, memPanel);
+        }
+    }
+    isMemoryAvailable() {
+        const perf = performance;
+        return perf.memory !== undefined;
+    }
+    addPanel(type, panel) {
+        this.dom.appendChild(panel.dom);
+        this.panels.set(type, panel);
+    }
+    startLoop() {
+        const loop = () => {
+            this.update();
+            this.animationFrameId = requestAnimationFrame(loop);
+        };
+        this.animationFrameId = requestAnimationFrame(loop);
+    }
+    stopLoop() {
+        if (this.animationFrameId !== null) {
+            cancelAnimationFrame(this.animationFrameId);
+            this.animationFrameId = null;
+        }
+    }
+    updateStats() {
+        this.frameCount++;
+        const currentTime = performance.now();
+        const deltaTime = currentTime - this.startTime;
+        const msPanel = this.panels.get(PanelType.MS);
+        if (msPanel) {
+            msPanel.update(deltaTime, STATS_CONFIG.MAX_MS_VALUE);
+        }
+        if (currentTime >= this.lastUpdateTime + STATS_CONFIG.UPDATE_INTERVAL) {
+            const fps = (this.frameCount * CONVERSION.MS_PER_SECOND) /
+                (currentTime - this.lastUpdateTime);
+            const fpsPanel = this.panels.get(PanelType.FPS);
+            if (fpsPanel) {
+                fpsPanel.update(fps, STATS_CONFIG.MAX_FPS_VALUE);
+            }
+            this.lastUpdateTime = currentTime;
+            this.frameCount = 0;
+            this.updateMemoryPanel();
+        }
+        return currentTime;
+    }
+    updateMemoryPanel() {
+        const memPanel = this.panels.get(PanelType.MEMORY);
+        if (!memPanel) {
+            return;
+        }
+        const perf = performance;
+        if (perf.memory) {
+            const memoryMB = perf.memory.usedJSHeapSize / CONVERSION.BYTES_TO_MB;
+            const maxMemoryMB = perf.memory.jsHeapSizeLimit / CONVERSION.BYTES_TO_MB;
+            memPanel.update(memoryMB, maxMemoryMB);
+        }
+    }
+}

package/dist/esm/RenderingEngine/helpers/stats/StatsPanel.d.ts

@@ -0,0 +1,24 @@
+import type { Panel } from './types';
+export declare class StatsPanel implements Panel {
+    dom: HTMLCanvasElement;
+    private context;
+    private minValue;
+    private maxValue;
+    private readonly name;
+    private readonly foregroundColor;
+    private readonly backgroundColor;
+    private readonly devicePixelRatio;
+    private readonly dimensions;
+    constructor(name: string, foregroundColor: string, backgroundColor: string);
+    update(value: number, maxValue: number): void;
+    private calculateDimensions;
+    private createCanvas;
+    private initializeContext;
+    private drawInitialPanel;
+    private updateMinMax;
+    private clearTextArea;
+    private drawText;
+    private formatText;
+    private scrollGraph;
+    private drawNewValue;
+}

package/dist/esm/RenderingEngine/helpers/stats/StatsPanel.js

@@ -0,0 +1,101 @@
+import { PANEL_CONFIG } from './constants';
+export class StatsPanel {
+    constructor(name, foregroundColor, backgroundColor) {
+        this.minValue = Infinity;
+        this.maxValue = 0;
+        this.name = name;
+        this.foregroundColor = foregroundColor;
+        this.backgroundColor = backgroundColor;
+        this.devicePixelRatio = Math.round(window.devicePixelRatio || 1);
+        this.dimensions = this.calculateDimensions();
+        this.dom = this.createCanvas();
+        this.context = this.initializeContext();
+        this.drawInitialPanel();
+    }
+    update(value, maxValue) {
+        this.updateMinMax(value);
+        this.clearTextArea();
+        this.drawText(value);
+        this.scrollGraph();
+        this.drawNewValue(value, maxValue);
+    }
+    calculateDimensions() {
+        const pr = this.devicePixelRatio;
+        return {
+            width: PANEL_CONFIG.WIDTH * pr,
+            height: PANEL_CONFIG.HEIGHT * pr,
+            textX: PANEL_CONFIG.TEXT_PADDING * pr,
+            textY: PANEL_CONFIG.TEXT_Y_OFFSET * pr,
+            graphX: PANEL_CONFIG.TEXT_PADDING * pr,
+            graphY: PANEL_CONFIG.GRAPH_Y_OFFSET * pr,
+            graphWidth: PANEL_CONFIG.GRAPH_WIDTH * pr,
+            graphHeight: PANEL_CONFIG.GRAPH_HEIGHT * pr,
+        };
+    }
+    createCanvas() {
+        const canvas = document.createElement('canvas');
+        canvas.width = this.dimensions.width;
+        canvas.height = this.dimensions.height;
+        canvas.style.cssText = `width:${PANEL_CONFIG.WIDTH}px;height:${PANEL_CONFIG.HEIGHT}px`;
+        return canvas;
+    }
+    initializeContext() {
+        const ctx = this.dom.getContext('2d');
+        if (!ctx) {
+            throw new Error('Failed to get 2D context');
+        }
+        ctx.font = `bold ${PANEL_CONFIG.FONT_SIZE * this.devicePixelRatio}px ${PANEL_CONFIG.FONT_FAMILY}`;
+        ctx.textBaseline = 'top';
+        return ctx;
+    }
+    drawInitialPanel() {
+        const { width, height, textX, textY, graphX, graphY, graphWidth, graphHeight, } = this.dimensions;
+        this.context.fillStyle = this.backgroundColor;
+        this.context.fillRect(0, 0, width, height);
+        this.context.fillStyle = this.foregroundColor;
+        this.context.fillText(this.name, textX, textY);
+        this.context.fillRect(graphX, graphY, graphWidth, graphHeight);
+        this.context.fillStyle = this.backgroundColor;
+        this.context.globalAlpha = PANEL_CONFIG.GRAPH_ALPHA;
+        this.context.fillRect(graphX, graphY, graphWidth, graphHeight);
+        this.context.globalAlpha = 1;
+    }
+    updateMinMax(value) {
+        this.minValue = Math.min(this.minValue, value);
+        this.maxValue = Math.max(this.maxValue, value);
+    }
+    clearTextArea() {
+        const { width, graphY } = this.dimensions;
+        this.context.fillStyle = this.backgroundColor;
+        this.context.fillRect(0, 0, width, graphY);
+    }
+    drawText(value) {
+        const { textX, textY } = this.dimensions;
+        const text = this.formatText(value);
+        this.context.fillStyle = this.foregroundColor;
+        this.context.fillText(text, textX, textY);
+    }
+    formatText(value) {
+        const roundedValue = Math.round(value);
+        const roundedMin = Math.round(this.minValue);
+        const roundedMax = Math.round(this.maxValue);
+        return `${roundedValue} ${this.name} (${roundedMin}-${roundedMax})`;
+    }
+    scrollGraph() {
+        const { graphX, graphY, graphWidth, graphHeight } = this.dimensions;
+        const pr = this.devicePixelRatio;
+        this.context.drawImage(this.dom, graphX + pr, graphY, graphWidth - pr, graphHeight, graphX, graphY, graphWidth - pr, graphHeight);
+    }
+    drawNewValue(value, maxValue) {
+        const { graphX, graphY, graphWidth, graphHeight } = this.dimensions;
+        const pr = this.devicePixelRatio;
+        const x = graphX + graphWidth - pr;
+        this.context.fillStyle = this.foregroundColor;
+        this.context.fillRect(x, graphY, pr, graphHeight);
+        const normalizedHeight = Math.round((1 - value / maxValue) * graphHeight);
+        this.context.fillStyle = this.backgroundColor;
+        this.context.globalAlpha = PANEL_CONFIG.GRAPH_ALPHA;
+        this.context.fillRect(x, graphY, pr, normalizedHeight);
+        this.context.globalAlpha = 1;
+    }
+}

package/dist/esm/RenderingEngine/helpers/stats/constants.d.ts

@@ -0,0 +1,44 @@
+declare const PANEL_CONFIG: {
+    readonly WIDTH: 160;
+    readonly HEIGHT: 96;
+    readonly TEXT_PADDING: 3;
+    readonly TEXT_Y_OFFSET: 2;
+    readonly GRAPH_Y_OFFSET: 15;
+    readonly GRAPH_WIDTH: 150;
+    readonly GRAPH_HEIGHT: 70;
+    readonly FONT_SIZE: 9;
+    readonly FONT_FAMILY: "Helvetica,Arial,sans-serif";
+    readonly GRAPH_ALPHA: 0.9;
+};
+declare const STATS_CONFIG: {
+    readonly UPDATE_INTERVAL: 1000;
+    readonly MAX_MS_VALUE: 200;
+    readonly MAX_FPS_VALUE: 300;
+    readonly OVERLAY_STYLES: {
+        readonly position: "fixed";
+        readonly top: "0px";
+        readonly right: "0px";
+        readonly left: "auto";
+        readonly zIndex: "9999";
+        readonly cursor: "pointer";
+        readonly opacity: "0.9";
+    };
+};
+declare const CONVERSION: {
+    readonly BYTES_TO_MB: 1048576;
+    readonly MS_PER_SECOND: 1000;
+};
+declare const PANEL_CONFIGS: readonly [{
+    readonly name: "FPS";
+    readonly foregroundColor: "#0ff";
+    readonly backgroundColor: "#002";
+}, {
+    readonly name: "MS";
+    readonly foregroundColor: "#0f0";
+    readonly backgroundColor: "#020";
+}, {
+    readonly name: "MB";
+    readonly foregroundColor: "#f08";
+    readonly backgroundColor: "#201";
+}];
+export { PANEL_CONFIG, STATS_CONFIG, CONVERSION, PANEL_CONFIGS };

package/dist/esm/RenderingEngine/helpers/stats/constants.js

@@ -0,0 +1,36 @@
+const PANEL_CONFIG = {
+    WIDTH: 160,
+    HEIGHT: 96,
+    TEXT_PADDING: 3,
+    TEXT_Y_OFFSET: 2,
+    GRAPH_Y_OFFSET: 15,
+    GRAPH_WIDTH: 150,
+    GRAPH_HEIGHT: 70,
+    FONT_SIZE: 9,
+    FONT_FAMILY: 'Helvetica,Arial,sans-serif',
+    GRAPH_ALPHA: 0.9,
+};
+const STATS_CONFIG = {
+    UPDATE_INTERVAL: 1000,
+    MAX_MS_VALUE: 200,
+    MAX_FPS_VALUE: 300,
+    OVERLAY_STYLES: {
+        position: 'fixed',
+        top: '0px',
+        right: '0px',
+        left: 'auto',
+        zIndex: '9999',
+        cursor: 'pointer',
+        opacity: '0.9',
+    },
+};
+const CONVERSION = {
+    BYTES_TO_MB: 1048576,
+    MS_PER_SECOND: 1000,
+};
+const PANEL_CONFIGS = [
+    { name: 'FPS', foregroundColor: '#0ff', backgroundColor: '#002' },
+    { name: 'MS', foregroundColor: '#0f0', backgroundColor: '#020' },
+    { name: 'MB', foregroundColor: '#f08', backgroundColor: '#201' },
+];
+export { PANEL_CONFIG, STATS_CONFIG, CONVERSION, PANEL_CONFIGS };

package/dist/esm/RenderingEngine/helpers/stats/enums.d.ts

@@ -0,0 +1,6 @@
+declare enum PanelType {
+    FPS = 0,
+    MS = 1,
+    MEMORY = 2
+}
+export { PanelType };

package/dist/esm/RenderingEngine/helpers/stats/enums.js

@@ -0,0 +1,7 @@
+var PanelType;
+(function (PanelType) {
+    PanelType[PanelType["FPS"] = 0] = "FPS";
+    PanelType[PanelType["MS"] = 1] = "MS";
+    PanelType[PanelType["MEMORY"] = 2] = "MEMORY";
+})(PanelType || (PanelType = {}));
+export { PanelType };

package/dist/esm/RenderingEngine/helpers/stats/index.d.ts

@@ -0,0 +1,2 @@
+import { StatsOverlay as Class } from './StatsOverlay';
+export declare const StatsOverlay: Class;

package/dist/esm/RenderingEngine/helpers/stats/index.js

@@ -0,0 +1,2 @@
+import { StatsOverlay as Class } from './StatsOverlay';
+export const StatsOverlay = Class.getInstance();

package/dist/esm/RenderingEngine/helpers/stats/types.d.ts

@@ -0,0 +1,22 @@
+interface Panel {
+    dom: HTMLCanvasElement;
+    update: (value: number, maxValue: number) => void;
+}
+interface StatsInstance {
+    dom: HTMLDivElement;
+    showPanel: (id: number) => void;
+    update: () => void;
+    destroy?: () => void;
+}
+interface PerformanceWithMemory extends Performance {
+    memory?: {
+        usedJSHeapSize: number;
+        jsHeapSizeLimit: number;
+    };
+}
+interface PanelConfig {
+    name: string;
+    foregroundColor: string;
+    backgroundColor: string;
+}
+export type { Panel, StatsInstance, PerformanceWithMemory, PanelConfig };

package/dist/esm/init.js

@@ -14,6 +14,9 @@ const defaultConfig = {
         renderingEngineMode: RenderingEngineModeEnum.ContextPool,
         webGlContextCount: 7,
     },
+    debug: {
+        statsOverlay: false,
+    },
     peerImport: (moduleId) => null,
 };
 let config = {

package/dist/esm/types/Cornerstone3DConfig.d.ts

@@ -11,6 +11,9 @@ interface Cornerstone3DConfig {
         renderingEngineMode?: RenderingEngineModeType;
         webGlContextCount?: number;
     };
+    debug: {
+        statsOverlay?: boolean;
+    };
     peerImport?: (moduleId: string) => Promise<any>;
 }
 export type { Cornerstone3DConfig as default };

package/dist/esm/types/IViewport.d.ts

@@ -24,8 +24,15 @@ export interface ReferenceCompatibleOptions {
 export type ReferencedImageRange = ViewReference & {
     referencedImageId: string;
 };
-export type ViewReference = {
+export type PlaneRestriction = {
+    FrameOfReferenceUID: string;
+    point: Point3;
+    inPlaneVector1?: Point3;
+    inPlaneVector2?: Point3;
+};
+export interface ViewReference {
     FrameOfReferenceUID?: string;
+    planeRestriction?: PlaneRestriction;
     referencedImageId?: string;
     referencedImageURI?: string;
     multiSliceReference?: ReferencedImageRange;
@@ -35,7 +42,7 @@ export type ViewReference = {
     sliceIndex?: number;
     volumeId?: string;
     bounds?: BoundsLPS;
-};
+}
 export interface ViewPresentation {
     slabThickness?: number;
     rotation?: number;

package/dist/esm/utilities/index.d.ts

@@ -94,6 +94,7 @@ export * as logger from './logger';
 import { calculateNeighborhoodStats } from './calculateNeighborhoodStats';
 import getPixelSpacingInformation from './getPixelSpacingInformation';
 import { asArray } from './asArray';
+export { updatePlaneRestriction } from './updatePlaneRestriction';
 declare const getViewportModality: (viewport: IViewport, volumeId?: string) => string;
 export * from './isEqual';
 export { FrameRange, eventListener, csUtils as invertRgbTransferFunction, createSigmoidRGBTransferFunction, getVoiFromSigmoidRGBTransferFunction, createLinearRGBTransferFunction, scaleRgbTransferFunction, triggerEvent, imageIdToURI, fnv1aHash, calibratedPixelSpacingMetadataProvider, clamp, uuidv4, getMinMax, getRuntimeId, isOpposite, getViewportModality, windowLevel, convertToGrayscale, getClosestImageId, getSpacingInNormalDirection, getTargetVolumeAndSpacingInNormalDir, getVolumeActorCorners, indexWithinDimensions, getVolumeViewportsContainingSameVolumes, getViewportsWithVolumeId, transformWorldToIndex, transformIndexToWorld, loadImageToCanvas, renderToCanvasCPU, renderToCanvasGPU, worldToImageCoords, imageToWorldCoords, getVolumeSliceRangeInfo, getVolumeViewportScrollInfo, getSliceRange, snapFocalPointToSlice, getImageSliceDataForVolumeViewport, isImageActor, isPTPrescaledWithSUV, actorIsA, getViewportsWithImageURI, getClosestStackImageIndexForPoint, getCurrentVolumeViewportSlice, calculateViewportsSpatialRegistration, spatialRegistrationMetadataProvider, getViewportImageCornersInWorld, hasNaNValues, applyPreset, deepMerge, PointsManager, getScalingParameters, colormap, getImageLegacy, ProgressiveIterator, decimate, imageRetrieveMetadataProvider, transferFunctionUtils, updateVTKImageDataWithCornerstoneImage, sortImageIdsAndGetSpacing, makeVolumeMetadata, isValidVolume, genericMetadataProvider, isVideoTransferSyntax, HistoryMemo, generateVolumePropsFromImageIds, getBufferConfiguration, VoxelManager, RLEVoxelMap, convertStackToVolumeViewport, convertVolumeToStackViewport, roundNumber, roundToPrecision, getViewportImageIds, getRandomSampleFromArray, getVolumeId, color, hasFloatScalingParameters, getDynamicVolumeInfo, autoLoad, scaleArray, deepClone, splitImageIdsBy4DTags, pointInShapeCallback, deepEqual, jumpToSlice, scroll, clip, transformWorldToIndexContinuous, createSubVolume, getVolumeDirectionVectors, calculateSpacingBetweenImageIds, getImageDataMetadata, buildMetadata, calculateNeighborhoodStats, getPixelSpacingInformation, asArray, };

package/dist/esm/utilities/index.js

@@ -95,6 +95,7 @@ export * as logger from './logger';
 import { calculateNeighborhoodStats } from './calculateNeighborhoodStats';
 import getPixelSpacingInformation from './getPixelSpacingInformation';
 import { asArray } from './asArray';
+export { updatePlaneRestriction } from './updatePlaneRestriction';
 const getViewportModality = (viewport, volumeId) => _getViewportModality(viewport, volumeId, cache.getVolume);
 export * from './isEqual';
 export { FrameRange, eventListener, csUtils as invertRgbTransferFunction, createSigmoidRGBTransferFunction, getVoiFromSigmoidRGBTransferFunction, createLinearRGBTransferFunction, scaleRgbTransferFunction, triggerEvent, imageIdToURI, fnv1aHash, calibratedPixelSpacingMetadataProvider, clamp, uuidv4, getMinMax, getRuntimeId, isOpposite, getViewportModality, windowLevel, convertToGrayscale, getClosestImageId, getSpacingInNormalDirection, getTargetVolumeAndSpacingInNormalDir, getVolumeActorCorners, indexWithinDimensions, getVolumeViewportsContainingSameVolumes, getViewportsWithVolumeId, transformWorldToIndex, transformIndexToWorld, loadImageToCanvas, renderToCanvasCPU, renderToCanvasGPU, worldToImageCoords, imageToWorldCoords, getVolumeSliceRangeInfo, getVolumeViewportScrollInfo, getSliceRange, snapFocalPointToSlice, getImageSliceDataForVolumeViewport, isImageActor, isPTPrescaledWithSUV, actorIsA, getViewportsWithImageURI, getClosestStackImageIndexForPoint, getCurrentVolumeViewportSlice, calculateViewportsSpatialRegistration, spatialRegistrationMetadataProvider, getViewportImageCornersInWorld, hasNaNValues, applyPreset, deepMerge, PointsManager, getScalingParameters, colormap, getImageLegacy, ProgressiveIterator, decimate, imageRetrieveMetadataProvider, transferFunctionUtils, updateVTKImageDataWithCornerstoneImage, sortImageIdsAndGetSpacing, makeVolumeMetadata, isValidVolume, genericMetadataProvider, isVideoTransferSyntax, HistoryMemo, generateVolumePropsFromImageIds, getBufferConfiguration, VoxelManager, RLEVoxelMap, convertStackToVolumeViewport, convertVolumeToStackViewport, roundNumber, roundToPrecision, getViewportImageIds, getRandomSampleFromArray, getVolumeId, color, hasFloatScalingParameters, getDynamicVolumeInfo, autoLoad, scaleArray, deepClone, splitImageIdsBy4DTags, pointInShapeCallback, deepEqual, jumpToSlice, scroll, clip, transformWorldToIndexContinuous, createSubVolume, getVolumeDirectionVectors, calculateSpacingBetweenImageIds, getImageDataMetadata, buildMetadata, calculateNeighborhoodStats, getPixelSpacingInformation, asArray, };

package/dist/esm/utilities/isEqual.d.ts

@@ -1,5 +1,5 @@
-export default function isEqual<ValueType>(v1: ValueType, v2: ValueType, tolerance?: number): boolean;
-declare const isEqualNegative: <ValueType>(v1: ValueType, v2: ValueType, tolerance?: any) => boolean;
-declare const isEqualAbs: <ValueType>(v1: ValueType, v2: ValueType, tolerance?: any) => boolean;
-declare function isNumber(n: number[] | number): boolean;
-export { isEqualNegative, isEqual, isEqualAbs, isNumber };
+export declare function isEqual<ValueType>(v1: ValueType, v2: ValueType, tolerance?: number): boolean;
+export declare const isEqualNegative: <ValueType>(v1: ValueType, v2: ValueType, tolerance?: any) => boolean;
+export declare const isEqualAbs: <ValueType>(v1: ValueType, v2: ValueType, tolerance?: any) => boolean;
+export declare function isNumber(n: number[] | number): boolean;
+export default isEqual;

package/dist/esm/utilities/isEqual.js

@@ -23,7 +23,7 @@ function isNumberArrayLike(value) {
         value.length > 0 &&
         typeof value[0] === 'number');
 }
-export default function isEqual(v1, v2, tolerance = 1e-5) {
+export function isEqual(v1, v2, tolerance = 1e-5) {
     if (typeof v1 !== typeof v2 || v1 === null || v2 === null) {
         return false;
     }
@@ -37,12 +37,12 @@ export default function isEqual(v1, v2, tolerance = 1e-5) {
 }
 const negative = (v) => typeof v === 'number' ? -v : v?.map ? v.map(negative) : !v;
 const abs = (v) => typeof v === 'number' ? Math.abs(v) : v?.map ? v.map(abs) : v;
-const isEqualNegative = (v1, v2, tolerance = undefined) => isEqual(v1, negative(v2), tolerance);
-const isEqualAbs = (v1, v2, tolerance = undefined) => isEqual(abs(v1), abs(v2), tolerance);
-function isNumber(n) {
+export const isEqualNegative = (v1, v2, tolerance = undefined) => isEqual(v1, negative(v2), tolerance);
+export const isEqualAbs = (v1, v2, tolerance = undefined) => isEqual(abs(v1), abs(v2), tolerance);
+export function isNumber(n) {
     if (Array.isArray(n)) {
         return isNumber(n[0]);
     }
     return isFinite(n) && !isNaN(n);
 }
-export { isEqualNegative, isEqual, isEqualAbs, isNumber };
+export default isEqual;

package/dist/esm/utilities/updatePlaneRestriction.d.ts

@@ -0,0 +1,2 @@
+import type { Point3, ViewReference } from '../types';
+export declare function updatePlaneRestriction(points: Point3[], reference: ViewReference): import("../types/IViewport").PlaneRestriction;

package/dist/esm/utilities/updatePlaneRestriction.js

@@ -0,0 +1,41 @@
+import { isEqual } from '../utilities/isEqual';
+import { vec3 } from 'gl-matrix';
+const ORTHOGONAL_TEST_VALUE = 0.95;
+export function updatePlaneRestriction(points, reference) {
+    if (!points?.length || !reference.FrameOfReferenceUID) {
+        return;
+    }
+    reference.planeRestriction ||= {
+        FrameOfReferenceUID: reference.FrameOfReferenceUID,
+        point: points[0],
+        inPlaneVector1: null,
+        inPlaneVector2: null,
+    };
+    const { planeRestriction } = reference;
+    if (points.length === 1) {
+        planeRestriction.inPlaneVector1 = null;
+        planeRestriction.inPlaneVector2 = null;
+        return planeRestriction;
+    }
+    const v1 = vec3.sub(vec3.create(), points[0], points[Math.floor(points.length / 2)]);
+    vec3.normalize(v1, v1);
+    planeRestriction.inPlaneVector1 = v1;
+    planeRestriction.inPlaneVector2 = null;
+    const n = points.length;
+    if (n > 2) {
+        for (let i = Math.floor(n / 3); i < n; i++) {
+            const testVector = vec3.sub(vec3.create(), points[i], points[0]);
+            const length = vec3.length(testVector);
+            if (isEqual(length, 0)) {
+                continue;
+            }
+            if (vec3.dot(testVector, planeRestriction.inPlaneVector1) <
+                length * ORTHOGONAL_TEST_VALUE) {
+                vec3.normalize(testVector, testVector);
+                planeRestriction.inPlaneVector2 = testVector;
+                return planeRestriction;
+            }
+        }
+    }
+    return planeRestriction;
+}

package/dist/esm/version.d.ts

@@ -1 +1 @@
-export declare const version = "3.30.3";
+export declare const version = "3.31.1";

package/dist/esm/version.js

@@ -1 +1 @@
-export const version = '3.30.3';
+export const version = '3.31.1';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cornerstonejs/core",
-  "version": "3.30.3",
+  "version": "3.31.1",
   "description": "Cornerstone3D Core",
   "module": "./dist/esm/index.js",
   "types": "./dist/esm/index.d.ts",
@@ -97,5 +97,5 @@
     "type": "individual",
     "url": "https://ohif.org/donate"
   },
-  "gitHead": "ff959f1bf57c60b727e2cd6563db13b194cbabb0"
+  "gitHead": "0fc65e9cc1d86a9a8b97ee9e7eb5802ce5e1e635"
 }