@cornerstonejs/tools 4.22.10 → 4.22.12

package/dist/esm/tools/annotation/CircleROITool.d.ts

@@ -18,6 +18,7 @@ declare class CircleROITool extends AnnotationTool {
     constructor(toolProps?: PublicToolProps, defaultToolProps?: ToolProps);
     addNewAnnotation: (evt: EventTypes.InteractionEventType) => CircleROIAnnotation;
     isPointNearTool: (element: HTMLDivElement, annotation: CircleROIAnnotation, canvasCoords: Types.Point2, proximity: number) => boolean;
+    _pointInEllipseCanvas(ellipse: any, location: Types.Point2): boolean;
     toolSelectedCallback: (evt: EventTypes.InteractionEventType, annotation: CircleROIAnnotation) => void;
     handleSelectedCallback: (evt: EventTypes.InteractionEventType, annotation: CircleROIAnnotation, handle: ToolHandle) => void;
     _endCallback: (evt: EventTypes.InteractionEventType) => void;

package/dist/esm/tools/annotation/CircleROITool.js

@@ -7,7 +7,7 @@ import { addAnnotation, getAnnotations, removeAnnotation, } from '../../stateMan
 import { isAnnotationLocked } from '../../stateManagement/annotation/annotationLocking';
 import { isAnnotationVisible } from '../../stateManagement/annotation/annotationVisibility';
 import { triggerAnnotationCompleted, triggerAnnotationModified, } from '../../stateManagement/annotation/helpers/state';
-import { drawCircle as drawCircleSvg, drawHandles as drawHandlesSvg, } from '../../drawingSvg';
+import { drawCircle as drawCircleSvg, drawHandles as drawHandlesSvg, drawEllipseByCoordinates, } from '../../drawingSvg';
 import { state } from '../../store/state';
 import { ChangeTypes, Events, MeasurementType } from '../../enums';
 import { getViewportIdsWithToolToRender } from '../../utilities/viewportFilters';
@@ -16,9 +16,10 @@ import triggerAnnotationRenderForViewportIds from '../../utilities/triggerAnnota
 import { getPixelValueUnits } from '../../utilities/getPixelValueUnits';
 import { isViewportPreScaled } from '../../utilities/viewport/isViewportPreScaled';
 import { getCanvasCircleCorners, getCanvasCircleRadius, } from '../../utilities/math/circle';
-import { pointInEllipse } from '../../utilities/math/ellipse';
+import { getCanvasEllipseCorners, pointInEllipse, } from '../../utilities/math/ellipse';
 import { BasicStatsCalculator } from '../../utilities/math/basic';
 import { getStyleProperty } from '../../stateManagement/annotation/config/helpers';
+import getEllipseWorldCoordinates from '../../utilities/getEllipseWorldCoordinates';
 const { transformWorldToIndex } = csUtils;
 class CircleROITool extends AnnotationTool {
     static { this.toolName = 'CircleROI'; }
@@ -74,11 +75,28 @@ class CircleROITool extends AnnotationTool {
             const enabledElement = getEnabledElement(element);
             const { viewport } = enabledElement;
             const { points } = annotation.data.handles;
-            const canvasHandles = points.map((p) => viewport.worldToCanvas(p));
-            const canvasCenter = canvasHandles[0];
-            const radius = getCanvasCircleRadius([canvasCenter, canvasHandles[1]]);
-            const radiusPoint = getCanvasCircleRadius([canvasCenter, canvasCoords]);
-            return Math.abs(radiusPoint - radius) < proximity / 2;
+            const ellipseWorldCoordinates = getEllipseWorldCoordinates(points.slice(0, 2), viewport);
+            const ellipseCanvasCoordinates = ellipseWorldCoordinates.map((p) => viewport.worldToCanvas(p));
+            const canvasCorners = getCanvasEllipseCorners(ellipseCanvasCoordinates);
+            const [canvasPoint1, canvasPoint2] = canvasCorners;
+            const minorEllipse = {
+                left: Math.min(canvasPoint1[0], canvasPoint2[0]) + proximity / 2,
+                top: Math.min(canvasPoint1[1], canvasPoint2[1]) + proximity / 2,
+                width: Math.abs(canvasPoint1[0] - canvasPoint2[0]) - proximity,
+                height: Math.abs(canvasPoint1[1] - canvasPoint2[1]) - proximity,
+            };
+            const majorEllipse = {
+                left: Math.min(canvasPoint1[0], canvasPoint2[0]) - proximity / 2,
+                top: Math.min(canvasPoint1[1], canvasPoint2[1]) - proximity / 2,
+                width: Math.abs(canvasPoint1[0] - canvasPoint2[0]) + proximity,
+                height: Math.abs(canvasPoint1[1] - canvasPoint2[1]) + proximity,
+            };
+            const pointInMinorEllipse = this._pointInEllipseCanvas(minorEllipse, canvasCoords);
+            const pointInMajorEllipse = this._pointInEllipseCanvas(majorEllipse, canvasCoords);
+            if (pointInMajorEllipse && !pointInMinorEllipse) {
+                return true;
+            }
+            return false;
         };
         this.toolSelectedCallback = (evt, annotation) => {
             const eventDetail = evt.detail;
@@ -417,7 +435,9 @@ class CircleROITool extends AnnotationTool {
                 }
                 const dataId = `${annotationUID}-circle`;
                 const circleUID = '0';
-                drawCircleSvg(svgDrawingHelper, annotationUID, circleUID, center, radius, {
+                const ellipseWorldCoordinates = getEllipseWorldCoordinates([points[0], points[1]], viewport);
+                const ellipseCanvasCoordinates = ellipseWorldCoordinates.map((p) => viewport.worldToCanvas(p));
+                drawEllipseByCoordinates(svgDrawingHelper, annotationUID, circleUID, ellipseCanvasCoordinates, {
                     color,
                     lineDash,
                     lineWidth,
@@ -578,6 +598,19 @@ class CircleROITool extends AnnotationTool {
         };
         this._throttledCalculateCachedStats = throttle(this._calculateCachedStats, 100, { trailing: true });
     }
+    _pointInEllipseCanvas(ellipse, location) {
+        const xRadius = ellipse.width / 2;
+        const yRadius = ellipse.height / 2;
+        if (xRadius <= 0.0 || yRadius <= 0.0) {
+            return false;
+        }
+        const center = [ellipse.left + xRadius, ellipse.top + yRadius];
+        const normalized = [location[0] - center[0], location[1] - center[1]];
+        const inEllipse = (normalized[0] * normalized[0]) / (xRadius * xRadius) +
+            (normalized[1] * normalized[1]) / (yRadius * yRadius) <=
+            1.0;
+        return inEllipse;
+    }
     static { this.hydrate = (viewportId, points, options) => {
         const enabledElement = getEnabledElementByViewportId(viewportId);
         if (!enabledElement) {

package/dist/esm/tools/segmentation/CircleScissorsTool.js

@@ -9,6 +9,8 @@ import triggerAnnotationRenderForViewportIds from '../../utilities/triggerAnnota
 import { segmentLocking, activeSegmentation, segmentIndex as segmentIndexController, config as segmentationConfig, } from '../../stateManagement/segmentation';
 import { getCurrentLabelmapImageIdForViewport, getSegmentation, } from '../../stateManagement/segmentation/segmentationState';
 import LabelmapBaseTool from './LabelmapBaseTool';
+import getEllipseWorldCoordinates from '../../utilities/getEllipseWorldCoordinates';
+import getCenterAndRadiusInCanvas from '../../utilities/getCenterAndRadiusInCanvas';
 class CircleScissorsTool extends LabelmapBaseTool {
     constructor(toolProps = {}, defaultToolProps = {
         supportedInteractionTypes: ['Mouse', 'Touch'],
@@ -123,28 +125,9 @@ class CircleScissorsTool extends LabelmapBaseTool {
             const { canvasToWorld } = viewport;
             const { annotation, viewportIdsToRender, centerCanvas } = this.editData;
             const { data } = annotation;
-            const dX = Math.abs(currentCanvasPoints[0] - centerCanvas[0]);
-            const dY = Math.abs(currentCanvasPoints[1] - centerCanvas[1]);
-            const radius = Math.sqrt(dX * dX + dY * dY);
-            const bottomCanvas = [
-                centerCanvas[0],
-                centerCanvas[1] + radius,
-            ];
-            const topCanvas = [centerCanvas[0], centerCanvas[1] - radius];
-            const leftCanvas = [
-                centerCanvas[0] - radius,
-                centerCanvas[1],
-            ];
-            const rightCanvas = [
-                centerCanvas[0] + radius,
-                centerCanvas[1],
-            ];
-            data.handles.points = [
-                canvasToWorld(bottomCanvas),
-                canvasToWorld(topCanvas),
-                canvasToWorld(leftCanvas),
-                canvasToWorld(rightCanvas),
-            ];
+            const centerWorld = canvasToWorld(centerCanvas);
+            const currentWorld = canvasToWorld(currentCanvasPoints);
+            data.handles.points = getEllipseWorldCoordinates([centerWorld, currentWorld], viewport);
             annotation.invalidated = true;
             this.editData.hasMoved = true;
             triggerAnnotationRenderForViewportIds(viewportIdsToRender);
@@ -207,14 +190,7 @@ class CircleScissorsTool extends LabelmapBaseTool {
             const annotationUID = annotation.annotationUID;
             const data = annotation.data;
             const { points } = data.handles;
-            const canvasCoordinates = points.map((p) => viewport.worldToCanvas(p));
-            const bottom = canvasCoordinates[0];
-            const top = canvasCoordinates[1];
-            const center = [
-                Math.floor((bottom[0] + top[0]) / 2),
-                Math.floor((bottom[1] + top[1]) / 2),
-            ];
-            const radius = Math.abs(bottom[1] - Math.floor((bottom[1] + top[1]) / 2));
+            const { center, radius } = getCenterAndRadiusInCanvas(points, viewport);
             const color = `rgb(${toolMetadata.segmentColor.slice(0, 3)})`;
             if (!viewport.getRenderingEngine()) {
                 console.warn('Rendering Engine has been destroyed');

package/dist/esm/tools/segmentation/SphereScissorsTool.js

@@ -8,6 +8,8 @@ import triggerAnnotationRenderForViewportIds from '../../utilities/triggerAnnota
 import { config as segmentationConfig, segmentLocking, segmentIndex as segmentIndexController, activeSegmentation, } from '../../stateManagement/segmentation';
 import { getSegmentation } from '../../stateManagement/segmentation/segmentationState';
 import LabelmapBaseTool from './LabelmapBaseTool';
+import getEllipseWorldCoordinates from '../../utilities/getEllipseWorldCoordinates';
+import { getCenterAndRadiusInCanvas } from '../../utilities/getCenterAndRadiusInCanvas';
 class SphereScissorsTool extends LabelmapBaseTool {
     constructor(toolProps = {}, defaultToolProps = {
         supportedInteractionTypes: ['Mouse', 'Touch'],
@@ -114,28 +116,9 @@ class SphereScissorsTool extends LabelmapBaseTool {
             const { canvasToWorld } = viewport;
             const { annotation, viewportIdsToRender, centerCanvas } = this.editData;
             const { data } = annotation;
-            const dX = Math.abs(currentCanvasPoints[0] - centerCanvas[0]);
-            const dY = Math.abs(currentCanvasPoints[1] - centerCanvas[1]);
-            const radius = Math.sqrt(dX * dX + dY * dY);
-            const bottomCanvas = [
-                centerCanvas[0],
-                centerCanvas[1] + radius,
-            ];
-            const topCanvas = [centerCanvas[0], centerCanvas[1] - radius];
-            const leftCanvas = [
-                centerCanvas[0] - radius,
-                centerCanvas[1],
-            ];
-            const rightCanvas = [
-                centerCanvas[0] + radius,
-                centerCanvas[1],
-            ];
-            data.handles.points = [
-                canvasToWorld(bottomCanvas),
-                canvasToWorld(topCanvas),
-                canvasToWorld(leftCanvas),
-                canvasToWorld(rightCanvas),
-            ];
+            const centerWorld = canvasToWorld(centerCanvas);
+            const currentWorld = canvasToWorld(currentCanvasPoints);
+            data.handles.points = getEllipseWorldCoordinates([centerWorld, currentWorld], viewport);
             annotation.invalidated = true;
             this.editData.hasMoved = true;
             triggerAnnotationRenderForViewportIds(viewportIdsToRender);
@@ -201,14 +184,7 @@ class SphereScissorsTool extends LabelmapBaseTool {
             const annotationUID = annotation.annotationUID;
             const data = annotation.data;
             const { points } = data.handles;
-            const canvasCoordinates = points.map((p) => viewport.worldToCanvas(p));
-            const bottom = canvasCoordinates[0];
-            const top = canvasCoordinates[1];
-            const center = [
-                Math.floor((bottom[0] + top[0]) / 2),
-                Math.floor((bottom[1] + top[1]) / 2),
-            ];
-            const radius = Math.abs(bottom[1] - Math.floor((bottom[1] + top[1]) / 2));
+            const { center, radius } = getCenterAndRadiusInCanvas(points, viewport);
             const color = `rgb(${toolMetadata.segmentColor.slice(0, 3)})`;
             if (!viewport.getRenderingEngine()) {
                 console.warn('Rendering Engine has been destroyed');

package/dist/esm/tools/segmentation/strategies/compositions/circularCursor.js

@@ -1,6 +1,7 @@
 import { vec3 } from 'gl-matrix';
 import StrategyCallbacks from '../../../../enums/StrategyCallbacks';
 import { drawCircle as drawCircleSvg } from '../../../../drawingSvg';
+import { getCenterAndRadiusInCanvas } from '../../../../utilities/getCenterAndRadiusInCanvas';
 export default {
     [StrategyCallbacks.CalculateCursorGeometry]: function (enabledElement, operationData) {
         if (!operationData) {
@@ -67,14 +68,7 @@ export default {
         const annotationUID = toolMetadata.brushCursorUID;
         const data = brushCursor.data;
         const { points } = data.handles;
-        const canvasCoordinates = points.map((p) => viewport.worldToCanvas(p));
-        const bottom = canvasCoordinates[0];
-        const top = canvasCoordinates[1];
-        const center = [
-            Math.floor((bottom[0] + top[0]) / 2),
-            Math.floor((bottom[1] + top[1]) / 2),
-        ];
-        const radius = Math.abs(bottom[1] - Math.floor((bottom[1] + top[1]) / 2));
+        const { center, radius } = getCenterAndRadiusInCanvas(points, viewport);
         const color = `rgb(${toolMetadata.segmentColor?.slice(0, 3) || [0, 0, 0]})`;
         if (!viewport.getRenderingEngine()) {
             console.warn('Rendering Engine has been destroyed');

package/dist/esm/tools/segmentation/strategies/fillCircle.d.ts

@@ -6,7 +6,9 @@ export declare function getEllipseCornersFromCanvasCoordinates(canvasCoordinates
 declare function createPointInEllipse(cornersInWorld?: Types.Point3[], options?: {
     strokePointsWorld?: Types.Point3[];
     segmentationImageData?: vtkImageData;
-    radius?: number;
+    xRadius?: number;
+    yRadius?: number;
+    aspectRatio?: [number, number];
 }): (pointLPS: Types.Point3 | null, pointIJK?: Types.Point3) => boolean;
 declare const CIRCLE_STRATEGY: BrushStrategy;
 declare const CIRCLE_THRESHOLD_STRATEGY: BrushStrategy;

package/dist/esm/tools/segmentation/strategies/fillCircle.js

@@ -5,7 +5,7 @@ import BrushStrategy from './BrushStrategy';
 import { StrategyCallbacks } from '../../../enums';
 import compositions from './compositions';
 import { pointInSphere } from '../../../utilities/math/sphere';
-const { transformWorldToIndex, transformIndexToWorld, isEqual } = csUtils;
+const { transformWorldToIndex, transformIndexToWorld, isEqual, getNormalizedAspectRatio, } = csUtils;
 export function getEllipseCornersFromCanvasCoordinates(canvasCoordinates) {
     const [bottom, top, left, right] = canvasCoordinates;
     const topLeft = [left[0], top[1]];
@@ -14,16 +14,16 @@ export function getEllipseCornersFromCanvasCoordinates(canvasCoordinates) {
     const topRight = [right[0], top[1]];
     return [topLeft, bottomRight, bottomLeft, topRight];
 }
-function createCircleCornersForCenter(center, viewUp, viewRight, radius) {
+function createCircleCornersForCenter(center, viewUp, viewRight, yRadius, xRadius) {
     const centerVec = vec3.fromValues(center[0], center[1], center[2]);
     const top = vec3.create();
-    vec3.scaleAndAdd(top, centerVec, viewUp, radius);
+    vec3.scaleAndAdd(top, centerVec, viewUp, yRadius);
     const bottom = vec3.create();
-    vec3.scaleAndAdd(bottom, centerVec, viewUp, -radius);
+    vec3.scaleAndAdd(bottom, centerVec, viewUp, -yRadius);
     const right = vec3.create();
-    vec3.scaleAndAdd(right, centerVec, viewRight, radius);
+    vec3.scaleAndAdd(right, centerVec, viewRight, xRadius);
     const left = vec3.create();
-    vec3.scaleAndAdd(left, centerVec, viewRight, -radius);
+    vec3.scaleAndAdd(left, centerVec, viewRight, -xRadius);
     return [
         bottom,
         top,
@@ -31,11 +31,12 @@ function createCircleCornersForCenter(center, viewUp, viewRight, radius) {
         right,
     ];
 }
-function createStrokePredicate(centers, radius) {
-    if (!centers.length || radius <= 0) {
+function createStrokePredicate(centers, xRadius, yRadius) {
+    if (!centers.length || xRadius <= 0 || yRadius <= 0) {
         return null;
     }
-    const radiusSquared = radius * radius;
+    const xRadiusSquared = xRadius * xRadius;
+    const yRadiusSquared = yRadius * yRadius;
     const centerVecs = centers.map((point) => [point[0], point[1], point[2]]);
     const segments = [];
     for (let i = 1; i < centerVecs.length; i++) {
@@ -55,7 +56,8 @@ function createStrokePredicate(centers, radius) {
             const dx = worldPoint[0] - centerVec[0];
             const dy = worldPoint[1] - centerVec[1];
             const dz = worldPoint[2] - centerVec[2];
-            if (dx * dx + dy * dy + dz * dz <= radiusSquared) {
+            if ((dx * dx) / xRadiusSquared + (dy * dy) / yRadiusSquared + dz * dz <=
+                1) {
                 return true;
             }
         }
@@ -64,7 +66,8 @@ function createStrokePredicate(centers, radius) {
                 const dx = worldPoint[0] - start[0];
                 const dy = worldPoint[1] - start[1];
                 const dz = worldPoint[2] - start[2];
-                if (dx * dx + dy * dy + dz * dz <= radiusSquared) {
+                if ((dx * dx) / xRadiusSquared + (dy * dy) / yRadiusSquared + dz * dz <=
+                    1) {
                     return true;
                 }
                 continue;
@@ -80,7 +83,10 @@ function createStrokePredicate(centers, radius) {
             const distX = worldPoint[0] - projX;
             const distY = worldPoint[1] - projY;
             const distZ = worldPoint[2] - projZ;
-            if (distX * distX + distY * distY + distZ * distZ <= radiusSquared) {
+            if ((distX * distX) / xRadiusSquared +
+                (distY * distY) / yRadiusSquared +
+                distZ * distZ <=
+                1) {
                 return true;
             }
         }
@@ -103,7 +109,13 @@ const initializeCircle = {
         }
         operationData.centerWorld = center;
         operationData.centerIJK = transformWorldToIndex(segmentationImageData, center);
-        const brushRadius = points.length >= 2 ? vec3.distance(points[0], points[1]) / 2 : 0;
+        const aspectRatio = getNormalizedAspectRatio(viewport.getAspectRatio());
+        const yRadius = points.length >= 2
+            ? vec3.distance(points[0], points[1]) / 2 / aspectRatio[1]
+            : 0;
+        const xRadius = points.length >= 2
+            ? vec3.distance(points[2], points[3]) / 2 / aspectRatio[0]
+            : 0;
         const canvasCoordinates = points.map((p) => viewport.worldToCanvas(p));
         const corners = getEllipseCornersFromCanvasCoordinates(canvasCoordinates);
         const cornersInWorld = corners.map((corner) => viewport.canvasToWorld(corner));
@@ -119,14 +131,16 @@ const initializeCircle = {
             ? operationData.strokePointsWorld
             : [operationData.centerWorld];
         const strokeCenters = strokeCentersSource.map((point) => vec3.clone(point));
-        const strokeCornersWorld = strokeCenters.flatMap((centerPoint) => createCircleCornersForCenter(centerPoint, normalizedViewUp, viewRight, brushRadius));
+        const strokeCornersWorld = strokeCenters.flatMap((centerPoint) => createCircleCornersForCenter(centerPoint, normalizedViewUp, viewRight, yRadius, xRadius));
         const circleCornersIJK = strokeCornersWorld.map((world) => transformWorldToIndex(segmentationImageData, world));
         const boundsIJK = getBoundingBoxAroundShapeIJK(circleCornersIJK, segmentationImageData.getDimensions());
         operationData.strokePointsWorld = strokeCenters;
         operationData.isInObject = createPointInEllipse(cornersInWorld, {
             strokePointsWorld: strokeCenters,
             segmentationImageData,
-            radius: brushRadius,
+            xRadius,
+            yRadius,
+            aspectRatio,
         });
         operationData.isInObjectBoundsIJK = boundsIJK;
     },
@@ -136,22 +150,22 @@ function createPointInEllipse(cornersInWorld = [], options = {}) {
         throw new Error('createPointInEllipse: cornersInWorld must have 4 points');
     }
     const [topLeft, bottomRight, bottomLeft, topRight] = cornersInWorld;
+    const aspectRatio = options.aspectRatio || [1, 1];
     const center = vec3.create();
     vec3.add(center, topLeft, bottomRight);
     vec3.scale(center, center, 0.5);
     const majorAxisVec = vec3.create();
     vec3.subtract(majorAxisVec, topRight, topLeft);
-    const xRadius = vec3.length(majorAxisVec) / 2;
+    const originalRadius = vec3.length(majorAxisVec) / 2;
     vec3.normalize(majorAxisVec, majorAxisVec);
     const minorAxisVec = vec3.create();
     vec3.subtract(minorAxisVec, bottomLeft, topLeft);
-    const yRadius = vec3.length(minorAxisVec) / 2;
     vec3.normalize(minorAxisVec, minorAxisVec);
-    const normal = vec3.create();
-    vec3.cross(normal, majorAxisVec, minorAxisVec);
-    vec3.normalize(normal, normal);
-    const radiusForStroke = options.radius ?? Math.max(xRadius, yRadius);
-    const strokePredicate = createStrokePredicate(options.strokePointsWorld || [], radiusForStroke);
+    const xRadius = originalRadius / aspectRatio[0];
+    const yRadius = originalRadius / aspectRatio[1];
+    const xRadiusForStroke = options.xRadius ?? xRadius;
+    const yRadiusForStroke = options.yRadius ?? yRadius;
+    const strokePredicate = createStrokePredicate(options.strokePointsWorld || [], xRadiusForStroke, yRadiusForStroke);
     if (isEqual(xRadius, yRadius)) {
         const radius = xRadius;
         const sphereObj = {
@@ -186,15 +200,8 @@ function createPointInEllipse(cornersInWorld = [], options = {}) {
         }
         const pointVec = vec3.create();
         vec3.subtract(pointVec, worldPoint, center);
-        const distToPlane = vec3.dot(pointVec, normal);
-        const proj = vec3.create();
-        vec3.scaleAndAdd(proj, pointVec, normal, -distToPlane);
-        const fromTopLeft = vec3.create();
-        const centerToTopLeft = vec3.create();
-        vec3.subtract(centerToTopLeft, center, topLeft);
-        vec3.subtract(fromTopLeft, proj, centerToTopLeft);
-        const x = vec3.dot(fromTopLeft, majorAxisVec);
-        const y = vec3.dot(fromTopLeft, minorAxisVec);
+        const x = vec3.dot(pointVec, majorAxisVec);
+        const y = vec3.dot(pointVec, minorAxisVec);
         return (x * x) / (xRadius * xRadius) + (y * y) / (yRadius * yRadius) <= 1;
     };
 }

package/dist/esm/tools/segmentation/strategies/fillSphere.js

@@ -4,7 +4,7 @@ import BrushStrategy from './BrushStrategy';
 import compositions from './compositions';
 import StrategyCallbacks from '../../../enums/StrategyCallbacks';
 import { createEllipseInPoint, getEllipseCornersFromCanvasCoordinates, } from './fillCircle';
-const { transformWorldToIndex } = csUtils;
+const { transformWorldToIndex, getNormalizedAspectRatio } = csUtils;
 import { getSphereBoundsInfoFromViewport } from '../../../utilities/getSphereBoundsInfo';
 const sphereComposition = {
     [StrategyCallbacks.Initialize]: (operationData) => {
@@ -26,7 +26,13 @@ const sphereComposition = {
         const canvasCoordinates = points.map((p) => viewport.worldToCanvas(p));
         const corners = getEllipseCornersFromCanvasCoordinates(canvasCoordinates);
         const cornersInWorld = corners.map((corner) => viewport.canvasToWorld(corner));
-        const strokeRadius = points.length >= 2 ? vec3.distance(points[0], points[1]) / 2 : undefined;
+        const aspectRatio = getNormalizedAspectRatio(viewport.getAspectRatio());
+        const yRadius = points.length >= 2
+            ? vec3.distance(points[0], points[1]) / 2 / aspectRatio[1]
+            : 0;
+        const xRadius = points.length >= 2
+            ? vec3.distance(points[2], points[3]) / 2 / aspectRatio[0]
+            : 0;
         const strokeCenters = operationData.strokePointsWorld &&
             operationData.strokePointsWorld.length > 0
             ? operationData.strokePointsWorld
@@ -90,7 +96,9 @@ const sphereComposition = {
         operationData.isInObject = createEllipseInPoint(cornersInWorld, {
             strokePointsWorld: operationData.strokePointsWorld,
             segmentationImageData,
-            radius: strokeRadius,
+            xRadius,
+            yRadius,
+            aspectRatio,
         });
     },
 };

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

@@ -0,0 +1,6 @@
+import { type Types, type VolumeViewport } from '@cornerstonejs/core';
+export declare function getCenterAndRadiusInCanvas(points: Types.Point3[], viewport: Types.IStackViewport | VolumeViewport): {
+    center: Types.Point2;
+    radius: number;
+};
+export default getCenterAndRadiusInCanvas;

package/dist/esm/utilities/getCenterAndRadiusInCanvas.js

@@ -0,0 +1,26 @@
+import {} from '@cornerstonejs/core';
+import { vec2, vec3 } from 'gl-matrix';
+const EPSILON = 1e-4;
+export function getCenterAndRadiusInCanvas(points, viewport) {
+    const canvasPoints = points.map((p) => viewport.worldToCanvas(p));
+    const [cBottom, cTop, cLeft, cRight] = canvasPoints;
+    const center = [
+        (cBottom[0] + cTop[0]) / 2,
+        (cBottom[1] + cTop[1]) / 2,
+    ];
+    const worldHeight = vec3.distance(points[0], points[1]);
+    const worldWidth = vec3.distance(points[2], points[3]);
+    const canvasHeight = vec2.distance(cBottom, cTop);
+    const canvasWidth = vec2.distance(cLeft, cRight);
+    const scaleX = canvasWidth / worldWidth;
+    const scaleY = canvasHeight / worldHeight;
+    const worldRadius = worldHeight / 2;
+    const radius = Math.abs(scaleX - scaleY) > EPSILON
+        ? worldRadius * Math.min(scaleX, scaleY)
+        : canvasHeight / 2;
+    return {
+        center: center,
+        radius: Math.round(radius),
+    };
+}
+export default getCenterAndRadiusInCanvas;

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

@@ -0,0 +1,2 @@
+import type { VolumeViewport, Types } from '@cornerstonejs/core';
+export default function getEllipseWorldCoordinates(points: [Types.Point3, Types.Point3], viewport: Types.IStackViewport | VolumeViewport): Types.Point3[];

package/dist/esm/utilities/getEllipseWorldCoordinates.js

@@ -0,0 +1,26 @@
+import { vec3 } from 'gl-matrix';
+export default function getEllipseWorldCoordinates(points, viewport) {
+    const camera = viewport.getCamera();
+    const { viewUp, viewPlaneNormal } = camera;
+    const viewRight = vec3.create();
+    vec3.cross(viewRight, viewUp, viewPlaneNormal);
+    const [centerWorld, endWorld] = points;
+    const centerToEndDistance = vec3.distance(centerWorld, endWorld);
+    const bottomWorld = vec3.create();
+    const topWorld = vec3.create();
+    const leftWorld = vec3.create();
+    const rightWorld = vec3.create();
+    for (let i = 0; i <= 2; i++) {
+        bottomWorld[i] = centerWorld[i] - viewUp[i] * centerToEndDistance;
+        topWorld[i] = centerWorld[i] + viewUp[i] * centerToEndDistance;
+        leftWorld[i] = centerWorld[i] - viewRight[i] * centerToEndDistance;
+        rightWorld[i] = centerWorld[i] + viewRight[i] * centerToEndDistance;
+    }
+    const ellipseWorldCoordinates = [
+        bottomWorld,
+        topWorld,
+        leftWorld,
+        rightWorld,
+    ];
+    return ellipseWorldCoordinates;
+}

package/dist/esm/version.d.ts

@@ -1 +1 @@
-export declare const version = "4.22.10";
+export declare const version = "4.22.12";

package/dist/esm/version.js

@@ -1 +1 @@
-export const version = '4.22.10';
+export const version = '4.22.12';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cornerstonejs/tools",
-  "version": "4.22.10",
+  "version": "4.22.12",
   "description": "Cornerstone3D Tools",
   "types": "./dist/esm/index.d.ts",
   "module": "./dist/esm/index.js",
@@ -105,11 +105,11 @@
     "lodash.get": "4.4.2"
   },
   "devDependencies": {
-    "@cornerstonejs/core": "4.22.10",
+    "@cornerstonejs/core": "4.22.12",
     "canvas": "3.2.0"
   },
   "peerDependencies": {
-    "@cornerstonejs/core": "4.22.10",
+    "@cornerstonejs/core": "4.22.12",
     "@kitware/vtk.js": "34.15.1",
     "@types/d3-array": "3.2.1",
     "@types/d3-interpolate": "3.0.4",
@@ -128,5 +128,5 @@
     "type": "individual",
     "url": "https://ohif.org/donate"
   },
-  "gitHead": "c6b2f1a3649b96a44a71e64c389f82079d74ba53"
+  "gitHead": "5cb108650fe38eac81881750b859b08de4c45cce"
 }