@cornerstonejs/core 5.0.0-beta.1 → 5.0.1

package/dist/esm/RenderingEngine/Viewport.js

@@ -18,16 +18,6 @@ import { updatePlaneRestriction } from '../utilities/updatePlaneRestriction';
 import { getCubeSizeInView } from '../utilities/getPlaneCubeIntersectionDimensions';
 import { getConfiguration } from '../init';
 class Viewport {
-    static { this.CameraViewPresentation = {
-        rotation: true,
-        pan: true,
-        zoom: true,
-        displayArea: true,
-    }; }
-    static { this.TransferViewPresentation = {
-        windowLevel: true,
-        paletteLut: true,
-    }; }
     constructor(props) {
         this.insetImageMultiplier = getConfiguration().rendering
             ?.useLegacyCameraFOV
@@ -91,6 +81,27 @@ class Viewport {
     static get useCustomRenderingPipeline() {
         return false;
     }
+    getUseCustomRenderingPipeline() {
+        return this.constructor.useCustomRenderingPipeline;
+    }
+    resizeForRenderingEngine({ keepCamera = true, } = {}) {
+        if (typeof this.resize === 'function') {
+            this.resize();
+        }
+        const previousCamera = keepCamera ? this.getCamera() : undefined;
+        this.resetCamera();
+        if (previousCamera) {
+            this.setCamera(previousCamera);
+        }
+    }
+    isOrientationChangeable() {
+        return false;
+    }
+    dispose() {
+    }
+    destroy() {
+        this.dispose();
+    }
     setRendered() {
         if (this.viewportStatus === ViewportStatus.NO_DATA ||
             this.viewportStatus === ViewportStatus.LOADING) {
@@ -98,6 +109,9 @@ class Viewport {
         }
         this.viewportStatus = ViewportStatus.RENDERED;
     }
+    setNeedsRender() {
+        this.viewportStatus = ViewportStatus.NEEDS_RENDER;
+    }
     setColorTransform(voiRange, averageWhite) {
         let feFilter = null;
         if (!voiRange && !averageWhite) {
@@ -137,7 +151,7 @@ class Viewport {
         renderingEngine.renderViewport(this.id);
     }
     setOptions(options, immediate = false) {
-        this.options = structuredClone(options);
+        this.options = deepClone(options);
         if (this.options?.displayArea) {
             this.setDisplayArea(this.options?.displayArea);
         }
@@ -146,7 +160,7 @@ class Viewport {
         }
     }
     reset(immediate = false) {
-        this.options = structuredClone(this.defaultOptions);
+        this.options = deepClone(this.defaultOptions);
         if (immediate) {
             this.render();
         }
@@ -166,7 +180,7 @@ class Viewport {
         const viewPlaneNormalToSet = vec3.negate(vec3.create(), viewPlaneNormal);
         const distance = vec3.distance(position, focalPoint);
         const dimensions = imageData.getDimensions();
-        const middleIJK = dimensions.map((d) => Math.floor(d / 2));
+        const middleIJK = getVolumeCenterIJK(dimensions, imageData.getDirection(), viewPlaneNormal);
         const idx = [middleIJK[0], middleIJK[1], middleIJK[2]];
         const centeredFocalPoint = imageData.indexToWorld(idx, vec3.create());
         const resetFocalPoint = this._getFocalPointForResetCamera(centeredFocalPoint, camera, { resetPan: true, resetToCenter: false });
@@ -497,7 +511,7 @@ class Viewport {
         return this.options?.displayArea;
     }
     resetCamera(options) {
-        const { resetPan = true, resetZoom = true, resetToCenter = true, storeAsInitialCamera = true, } = options || {};
+        const { resetPan = true, resetZoom = true, resetToCenter = true, storeAsInitialCamera = true, resetAspectRatio = true, } = options || {};
         const renderer = this.getRenderer();
         this.setCameraNoEvent({
             flipHorizontal: false,
@@ -523,18 +537,13 @@ class Viewport {
         focalPoint[2] = (bounds[4] + bounds[5]) / 2.0;
         if (imageData) {
             const dimensions = imageData.getDimensions();
-            const middleIJK = dimensions.map((d) => Math.floor(d / 2));
+            const middleIJK = getVolumeCenterIJK(dimensions, imageData.getDirection(), viewPlaneNormal);
             const idx = [middleIJK[0], middleIJK[1], middleIJK[2]];
             imageData.indexToWorld(idx, focalPoint);
         }
-        let { widthWorld, heightWorld } = imageData
+        const { widthWorld, heightWorld } = imageData
             ? getCubeSizeInView(imageData, viewPlaneNormal, viewUp)
             : this._getWorldDistanceViewUpAndViewRight(bounds, viewUp, viewPlaneNormal);
-        if (imageData) {
-            const spacing = imageData.getSpacing();
-            widthWorld = Math.max(spacing[0], widthWorld - spacing[0]);
-            heightWorld = Math.max(spacing[1], heightWorld - spacing[1]);
-        }
         const canvasSize = [this.sWidth, this.sHeight];
         const boundsAspectRatio = widthWorld / heightWorld;
         const canvasAspectRatio = canvasSize[0] / canvasSize[1];
@@ -561,6 +570,9 @@ class Viewport {
         ];
         activeCamera.setPhysicalScale(radius);
         activeCamera.setPhysicalTranslation(-focalPointToSet[0], -focalPointToSet[1], -focalPointToSet[2]);
+        const targetAspectRatio = resetAspectRatio
+            ? this.options?.aspectRatio || [1, 1]
+            : this.getAspectRatio();
         this.setCamera({
             parallelScale: resetZoom ? parallelScale : previousCamera.parallelScale,
             focalPoint: focalPointToSet,
@@ -568,6 +580,8 @@ class Viewport {
             viewAngle: 90,
             viewUp: viewUpToSet,
             clippingRange: clippingRangeToUse,
+            aspectRatio: targetAspectRatio,
+            isFitViewportAfterStretch: false,
         });
         const modifiedCamera = this.getCamera();
         this.setFitToCanvasCamera(this.getCamera());
@@ -661,6 +675,21 @@ class Viewport {
             parallelScale,
         }, storeAsInitialCamera);
     }
+    getAspectRatio() {
+        const { aspectRatio } = this.getCamera();
+        return aspectRatio ?? this.options?.aspectRatio ?? [1, 1];
+    }
+    setAspectRatio(value, isFitViewportAfterStretch = true, storeAsInitialCamera = false) {
+        const camera = this.getCamera();
+        if (storeAsInitialCamera) {
+            this.options.aspectRatio = value;
+        }
+        this.setCamera({
+            ...camera,
+            aspectRatio: value,
+            isFitViewportAfterStretch,
+        }, storeAsInitialCamera);
+    }
     _getFocalPointForViewPlaneReset(imageData) {
         const { focalPoint, viewPlaneNormal: normal } = this.getCamera();
         const intersections = this._getViewImageDataIntersections(imageData, focalPoint, normal);
@@ -709,6 +738,7 @@ class Viewport {
             viewAngle: vtkCamera.getViewAngle(),
             flipHorizontal: this.flipHorizontal,
             flipVertical: this.flipVertical,
+            aspectRatio: vtkCamera.getAspectRatio(),
         };
     }
     getCamera() {
@@ -718,11 +748,56 @@ class Viewport {
             rotation: this.getRotation(),
         };
     }
+    setAspectRatioForVTKCamera(aspectRatio, isFitViewportAfterStretch = true) {
+        const vtkCamera = this.getVtkActiveCamera();
+        if (!isFitViewportAfterStretch) {
+            vtkCamera.setAspectRatio(aspectRatio);
+            return;
+        }
+        const currentAspect = vtkCamera.getAspectRatio() || [1, 1];
+        if (currentAspect[0] === aspectRatio[0] &&
+            currentAspect[1] === aspectRatio[1]) {
+            return;
+        }
+        const getRatioValue = ([x, y]) => x / y;
+        const oldRatioValue = getRatioValue(currentAspect);
+        const newRatioValue = getRatioValue(aspectRatio);
+        vtkCamera.setAspectRatio(aspectRatio);
+        const imageData = this.getDefaultImageData();
+        if (!imageData)
+            return;
+        const getFitScale = (rVal) => {
+            const { widthWorld, heightWorld } = getCubeSizeInView(imageData, vtkCamera.getViewPlaneNormal(), vtkCamera.getViewUp());
+            const canvasAspectRatio = this.sWidth / this.sHeight;
+            const effectiveWidth = widthWorld * rVal;
+            const effectiveImageRatio = effectiveWidth / heightWorld;
+            let fitScale = effectiveImageRatio > canvasAspectRatio
+                ? effectiveWidth / (2 * canvasAspectRatio)
+                : heightWorld / 2;
+            if (rVal < 1)
+                fitScale /= rVal;
+            return fitScale;
+        };
+        const ratioFactor = getFitScale(newRatioValue) / getFitScale(oldRatioValue);
+        vtkCamera.setParallelScale(vtkCamera.getParallelScale() * ratioFactor);
+        if (this.initialCamera?.parallelScale) {
+            this.initialCamera = {
+                ...this.initialCamera,
+                parallelScale: this.initialCamera.parallelScale * ratioFactor,
+            };
+        }
+        if (this.fitToCanvasCamera?.parallelScale) {
+            this.fitToCanvasCamera = {
+                ...this.fitToCanvasCamera,
+                parallelScale: this.fitToCanvasCamera.parallelScale * ratioFactor,
+            };
+        }
+    }
     setCamera(cameraInterface, storeAsInitialCamera = false) {
         const vtkCamera = this.getVtkActiveCamera();
         const previousCamera = this.getCamera();
         const updatedCamera = Object.assign({}, previousCamera, cameraInterface);
-        const { viewUp, viewPlaneNormal, position, focalPoint, parallelScale, viewAngle, flipHorizontal, flipVertical, clippingRange, } = cameraInterface;
+        const { viewUp, viewPlaneNormal, position, focalPoint, parallelScale, viewAngle, flipHorizontal, flipVertical, clippingRange, aspectRatio, isFitViewportAfterStretch, } = cameraInterface;
         if (flipHorizontal !== undefined) {
             const flipH = (flipHorizontal && !this.flipHorizontal) ||
                 (!flipHorizontal && this.flipHorizontal);
@@ -758,6 +833,9 @@ class Viewport {
         if (clippingRange !== undefined) {
             vtkCamera.setClippingRange(clippingRange);
         }
+        if (aspectRatio) {
+            this.setAspectRatioForVTKCamera(aspectRatio, isFitViewportAfterStretch);
+        }
         const prevFocalPoint = previousCamera.focalPoint;
         const prevViewUp = previousCamera.viewUp;
         if ((prevFocalPoint && focalPoint) || (prevViewUp && viewUp)) {
@@ -980,6 +1058,7 @@ class Viewport {
         displayArea: true,
         zoom: true,
         pan: true,
+        aspectRatio: true,
         flipHorizontal: true,
         flipVertical: true,
     }) {
@@ -995,9 +1074,14 @@ class Viewport {
         if (zoom) {
             target.zoom = initZoom;
         }
+        const currentAspectRatio = this.getAspectRatio();
+        target.aspectRatio = currentAspectRatio;
         if (pan) {
-            target.pan = this.getPan();
-            vec2.scale(target.pan, target.pan, 1 / initZoom);
+            const currentPan = this.getPan();
+            const [aspectX, aspectY] = currentAspectRatio;
+            const normalizedPanX = currentPan[0] / (initZoom * aspectX);
+            const normalizedPanY = currentPan[1] / (initZoom * aspectY);
+            target.pan = [normalizedPanX, normalizedPanY];
         }
         if (flipHorizontal) {
             target.flipHorizontal = this.flipHorizontal;
@@ -1007,19 +1091,21 @@ class Viewport {
         }
         return target;
     }
-    setViewReference(viewRef) {
+    setViewReference(_viewRef) {
     }
     setViewPresentation(viewPres) {
         if (!viewPres) {
             return;
         }
-        const { displayArea, zoom = this.getZoom(), pan, rotation, flipHorizontal = this.flipHorizontal, flipVertical = this.flipVertical, } = viewPres;
+        const { displayArea, zoom = this.getZoom(), pan, aspectRatio = this.getAspectRatio(), rotation, flipHorizontal = this.flipHorizontal, flipVertical = this.flipVertical, } = viewPres;
         if (displayArea !== this.getDisplayArea()) {
             this.setDisplayArea(displayArea);
         }
         this.setZoom(zoom);
+        this.setAspectRatio(aspectRatio);
         if (pan) {
-            this.setPan(vec2.scale([0, 0], pan, zoom));
+            const [aspectX, aspectY] = aspectRatio;
+            this.setPan([pan[0] * zoom * aspectX, pan[1] * zoom * aspectY]);
         }
         if (flipHorizontal !== undefined &&
             flipHorizontal !== this.flipHorizontal) {
@@ -1100,8 +1186,42 @@ class Viewport {
         const radius = Math.sqrt(w1 + w2 + w3 || 1) * 0.5;
         return radius;
     }
-    setDataIds(_imageIds, _options) {
-        throw new Error('Unsupported operatoin setDataIds');
+    setDataList(_entries) {
+        throw new Error('Unsupported operation setDataList');
     }
 }
+Viewport.CameraViewPresentation = {
+    rotation: true,
+    pan: true,
+    zoom: true,
+    aspectRatio: true,
+    displayArea: true,
+};
+Viewport.TransferViewPresentation = {
+    windowLevel: true,
+    paletteLut: true,
+};
+export function getVolumeCenterIJK(dimensions, direction, viewPlaneNormal) {
+    const ijkAxes = [
+        [direction[0], direction[1], direction[2]],
+        [direction[3], direction[4], direction[5]],
+        [direction[6], direction[7], direction[8]],
+    ];
+    const normal = [
+        viewPlaneNormal[0],
+        viewPlaneNormal[1],
+        viewPlaneNormal[2],
+    ];
+    let sliceAxis = 0;
+    let maxDot = -1;
+    for (let i = 0; i < 3; i++) {
+        const dot = Math.abs(vec3.dot(ijkAxes[i], normal));
+        if (dot > maxDot) {
+            maxDot = dot;
+            sliceAxis = i;
+        }
+    }
+    const isAxisAligned = Math.abs(maxDot - 1) < 1e-3;
+    return dimensions.map((d, i) => i === sliceAxis && isAxisAligned ? Math.floor(d / 2) : (d - 1) / 2);
+}
 export default Viewport;

package/dist/esm/RenderingEngine/VolumeViewport.js

@@ -3,20 +3,17 @@ import vtkPlane from '@kitware/vtk.js/Common/DataModel/Plane';
 import cache from '../cache/cache';
 import { EPSILON, MPR_CAMERA_VALUES, RENDERING_DEFAULTS } from '../constants';
 import { OrientationAxis, Events } from '../enums';
-import { actorIsA, isImageActor } from '../utilities/actorCheck';
+import { actorIsA } from '../utilities/actorCheck';
 import getClosestImageId from '../utilities/getClosestImageId';
-import getSliceRange from '../utilities/getSliceRange';
-import getSpacingInNormalDirection from '../utilities/getSpacingInNormalDirection';
-import snapFocalPointToSlice from '../utilities/snapFocalPointToSlice';
 import triggerEvent from '../utilities/triggerEvent';
 import BaseVolumeViewport from './BaseVolumeViewport';
 import setDefaultVolumeVOI from './helpers/setDefaultVolumeVOI';
-import { setTransferFunctionNodes } from '../utilities/transferFunctionUtils';
 import getImageSliceDataForVolumeViewport from '../utilities/getImageSliceDataForVolumeViewport';
 import { transformCanvasToIJK } from '../utilities/transformCanvasToIJK';
 import { transformIJKToCanvas } from '../utilities/transformIJKToCanvas';
 import getVolumeViewportScrollInfo from '../utilities/getVolumeViewportScrollInfo';
 import { calculateCameraPosition, getCameraVectors, } from './helpers/getCameraVectors';
+import { getPlanarVolumeSliceNavigationState, getPlanarVolumeSlicePoint, } from './helpers/planarVolumeRendering';
 class VolumeViewport extends BaseVolumeViewport {
     constructor(props) {
         super(props);
@@ -67,14 +64,29 @@ class VolumeViewport extends BaseVolumeViewport {
             const imageVolume = cache.getVolume(volumeId);
             const camera = this.getCamera();
             const { focalPoint, position, viewPlaneNormal } = camera;
-            const spacingInNormalDirection = getSpacingInNormalDirection(imageVolume, viewPlaneNormal);
-            const sliceRange = getSliceRange(actorEntry.actor, viewPlaneNormal, focalPoint);
+            const { currentSliceIndex, sliceRange, spacingInNormalDirection } = getPlanarVolumeSliceNavigationState({
+                actor: actorEntry.actor,
+                camera: {
+                    focalPoint,
+                    position,
+                    viewPlaneNormal,
+                },
+                imageVolume,
+            });
             const numSlicesBackward = Math.round((sliceRange.current - sliceRange.min) / spacingInNormalDirection);
             const numSlicesForward = Math.round((sliceRange.max - sliceRange.current) / spacingInNormalDirection);
-            const currentSliceIndex = this.getSliceIndex();
             const focalPoints = [];
             for (let i = -numSlicesBackward; i <= numSlicesForward; i++) {
-                const { newFocalPoint: point } = snapFocalPointToSlice(focalPoint, position, sliceRange, viewPlaneNormal, spacingInNormalDirection, i);
+                const { newFocalPoint: point } = getPlanarVolumeSlicePoint({
+                    camera: {
+                        focalPoint,
+                        position,
+                        viewPlaneNormal,
+                    },
+                    delta: i,
+                    sliceRange,
+                    spacingInNormalDirection,
+                });
                 focalPoints.push({ sliceIndex: currentSliceIndex + i, point });
             }
             return focalPoints;
@@ -277,12 +289,12 @@ class VolumeViewport extends BaseVolumeViewport {
         }
     }
     resetCamera(options) {
-        const { resetPan = true, resetZoom = true, resetRotation = true, resetToCenter = true, suppressEvents = false, resetOrientation = true, } = options || {};
+        const { resetPan = true, resetZoom = true, resetRotation = true, resetToCenter = true, suppressEvents = false, resetOrientation = true, resetAspectRatio = true, } = options || {};
         const { orientation } = this.viewportProperties;
         if (orientation && resetOrientation) {
             this.applyViewOrientation(orientation, false);
         }
-        super.resetCamera({ resetPan, resetZoom, resetToCenter });
+        super.resetCamera({ resetPan, resetZoom, resetToCenter, resetAspectRatio });
         const activeCamera = this.getVtkActiveCamera();
         const viewPlaneNormal = activeCamera.getViewPlaneNormal();
         const focalPoint = activeCamera.getFocalPoint();
@@ -466,12 +478,7 @@ class VolumeViewport extends BaseVolumeViewport {
             throw new Error(`imageVolume with id: ${volumeId} does not exist in cache`);
         }
         setDefaultVolumeVOI(volumeActor.actor, imageVolume);
-        if (isImageActor(volumeActor)) {
-            const transferFunction = volumeActor.actor
-                .getProperty()
-                .getRGBTransferFunction(0);
-            setTransferFunctionNodes(transferFunction, this.initialTransferFunctionNodes);
-        }
+        this._restoreVolumeRenderingDefaults(volumeActor, volumeId);
         const eventDetails = {
             ...super.getVOIModifiedEventDetail(volumeId),
         };
@@ -479,11 +486,13 @@ class VolumeViewport extends BaseVolumeViewport {
         const resetZoom = true;
         const resetToCenter = true;
         const resetCameraRotation = true;
+        const resetAspectRatio = true;
         this.resetCamera({
             resetPan,
             resetZoom,
             resetToCenter,
             resetCameraRotation,
+            resetAspectRatio,
         });
         triggerEvent(this.element, Events.VOI_MODIFIED, eventDetails);
     }

package/dist/esm/RenderingEngine/VolumeViewport3D.js

@@ -3,8 +3,7 @@ import { OrientationAxis, Events } from '../enums';
 import cache from '../cache/cache';
 import setDefaultVolumeVOI from './helpers/setDefaultVolumeVOI';
 import triggerEvent from '../utilities/triggerEvent';
-import { actorIsA, isImageActor } from '../utilities/actorCheck';
-import { setTransferFunctionNodes } from '../utilities/transferFunctionUtils';
+import { actorIsA } from '../utilities/actorCheck';
 import BaseVolumeViewport from './BaseVolumeViewport';
 class VolumeViewport3D extends BaseVolumeViewport {
     constructor(props) {
@@ -98,12 +97,7 @@ class VolumeViewport3D extends BaseVolumeViewport {
             throw new Error(`imageVolume with id: ${volumeId} does not exist in cache`);
         }
         setDefaultVolumeVOI(volumeActor.actor, imageVolume);
-        if (isImageActor(volumeActor)) {
-            const transferFunction = volumeActor.actor
-                .getProperty()
-                .getRGBTransferFunction(0);
-            setTransferFunctionNodes(transferFunction, this.initialTransferFunctionNodes);
-        }
+        this._restoreVolumeRenderingDefaults(volumeActor, volumeId);
         this.setCamera(this.initialCamera);
         triggerEvent(this.element, Events.VOI_MODIFIED, super.getVOIModifiedEventDetail(volumeId));
     }

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

@@ -3,16 +3,16 @@ import type { WSIViewportProperties, Point3, Point2, ICamera, VOIRange, CPUIImag
 import { Transform } from './helpers/cpuFallback/rendering/transform';
 import Viewport from './Viewport';
 import type { DataSetOptions } from '../types/IViewport';
+import { type WSIClientLike, type WSIImageDataMetadata, type WSIMapLike, type WSIMapViewLike } from '../utilities/WSIUtilities';
 declare class WSIViewport extends Viewport {
     modality: any;
     protected imageIds: string[];
     readonly uid: any;
     readonly renderingEngineId: string;
     private frameOfReferenceUID;
-    protected metadata: any;
-    protected metadataDicomweb: any;
+    protected metadata: WSIImageDataMetadata;
     private microscopyElement;
-    protected map: any;
+    protected map: WSIMapLike;
     private imageURISet;
     private internalCamera;
     private viewer;
@@ -25,8 +25,7 @@ declare class WSIViewport extends Viewport {
     private addEventListeners;
     private removeEventListeners;
     private elementDisabledHandler;
-    private getImageDataMetadata;
-    setFrameNumber(frame: number): Promise<void>;
+    setFrameNumber(_frame: number): Promise<void>;
     setProperties(props: WSIViewportProperties): void;
     getProperties: () => WSIViewportProperties;
     resetProperties(): void;
@@ -45,7 +44,6 @@ declare class WSIViewport extends Viewport {
     getCamera(): ICamera;
     resetCamera: () => boolean;
     getNumberOfSlices: () => number;
-    static getDicomMicroscopyViewer: () => Promise<any>;
     getFrameOfReferenceUID: () => string;
     resize: () => void;
     worldToIndexWSI(point: Point3): Point2;
@@ -54,27 +52,29 @@ declare class WSIViewport extends Viewport {
     indexToWorld(point: Point3): Point3;
     canvasToWorld: (canvasPos: Point2) => Point3;
     worldToCanvas: (worldPos: Point3) => Point2;
+    setDataList(entries: Array<{
+        dataId: string;
+        options?: Record<string, unknown>;
+    }>): Promise<void>;
     setDataIds(imageIds: string[], options?: DataSetOptions & {
         miniNavigationOverlay?: boolean;
-        webClient: unknown;
+        webClient: WSIClientLike;
     }): Promise<void>;
-    setWSI(imageIds: string[], client: any): Promise<void>;
+    setWSI(imageIds: string[], client: WSIClientLike): Promise<void>;
     postrender: () => void;
     scroll(delta: number): void;
     getRotation: () => number;
     protected canvasToIndex: (canvasPos: Point2) => Point3;
     protected indexToCanvas: (indexPos: Point3) => Point2;
     getSliceIndex(): number;
-    getView(): any;
+    getView(): WSIMapViewLike | undefined;
     private refreshRenderValues;
     customRenderViewportToCanvas: () => void;
-    getZoom(): any;
+    getZoom(): number;
     setZoom(zoom: number): void;
     getImageIds: () => Array<string>;
     protected getTransform(): Transform;
     getViewReferenceId(): string;
     getCurrentImageIdIndex(): number;
-    private static overlayCssId;
-    static addMiniNavigationOverlayCss(): void;
 }
 export default WSIViewport;