@cornerstonejs/tools 3.0.2 → 3.0.3

package/dist/esm/tools/ReferenceLinesTool.js

@@ -0,0 +1,232 @@
+import { vec3 } from 'gl-matrix';
+import { getRenderingEngines, CONSTANTS, utilities as csUtils, } from '@cornerstonejs/core';
+import { getEnabledElementByViewportId } from '@cornerstonejs/core';
+import { addAnnotation } from '../stateManagement/annotation/annotationState';
+import { drawLine as drawLineSvg } from '../drawingSvg';
+import { filterViewportsWithToolEnabled } from '../utilities/viewportFilters';
+import triggerAnnotationRenderForViewportIds from '../utilities/triggerAnnotationRenderForViewportIds';
+import AnnotationDisplayTool from './base/AnnotationDisplayTool';
+const { EPSILON } = CONSTANTS;
+class ReferenceLines extends AnnotationDisplayTool {
+    constructor(toolProps = {}, defaultToolProps = {
+        supportedInteractionTypes: ['Mouse', 'Touch'],
+        configuration: {
+            sourceViewportId: '',
+            enforceSameFrameOfReference: true,
+            showFullDimension: false,
+        },
+    }) {
+        super(toolProps, defaultToolProps);
+        this.editData = null;
+        this._init = () => {
+            const renderingEngines = getRenderingEngines();
+            const renderingEngine = renderingEngines[0];
+            if (!renderingEngine) {
+                return;
+            }
+            let viewports = renderingEngine.getViewports();
+            viewports = filterViewportsWithToolEnabled(viewports, this.getToolName());
+            const sourceViewport = renderingEngine.getViewport(this.configuration.sourceViewportId);
+            if (!sourceViewport?.getImageData()) {
+                return;
+            }
+            const { element } = sourceViewport;
+            const { viewUp, viewPlaneNormal } = sourceViewport.getCamera();
+            const sourceViewportCanvasCornersInWorld = csUtils.getViewportImageCornersInWorld(sourceViewport);
+            let annotation = this.editData?.annotation;
+            const FrameOfReferenceUID = sourceViewport.getFrameOfReferenceUID();
+            if (!annotation) {
+                const newAnnotation = {
+                    highlighted: true,
+                    invalidated: true,
+                    metadata: {
+                        toolName: this.getToolName(),
+                        viewPlaneNormal: [...viewPlaneNormal],
+                        viewUp: [...viewUp],
+                        FrameOfReferenceUID,
+                        referencedImageId: null,
+                    },
+                    data: {
+                        handles: {
+                            points: sourceViewportCanvasCornersInWorld,
+                        },
+                    },
+                };
+                addAnnotation(newAnnotation, element);
+                annotation = newAnnotation;
+            }
+            else {
+                this.editData.annotation.data.handles.points =
+                    sourceViewportCanvasCornersInWorld;
+            }
+            this.editData = {
+                sourceViewportId: sourceViewport.id,
+                renderingEngine,
+                annotation,
+            };
+            triggerAnnotationRenderForViewportIds(viewports
+                .filter((viewport) => viewport.id !== sourceViewport.id)
+                .map((viewport) => viewport.id));
+        };
+        this.onSetToolEnabled = () => {
+            this._init();
+        };
+        this.onSetToolConfiguration = () => {
+            this._init();
+        };
+        this.onCameraModified = (evt) => {
+            this._init();
+        };
+        this.renderAnnotation = (enabledElement, svgDrawingHelper) => {
+            const { viewport: targetViewport } = enabledElement;
+            if (!this.editData) {
+                return false;
+            }
+            const { annotation, sourceViewportId } = this.editData;
+            let renderStatus = false;
+            const { viewport: sourceViewport } = getEnabledElementByViewportId(sourceViewportId) || {};
+            if (!sourceViewport) {
+                return renderStatus;
+            }
+            if (sourceViewport.id === targetViewport.id) {
+                return renderStatus;
+            }
+            if (!annotation || !annotation?.data?.handles?.points) {
+                return renderStatus;
+            }
+            if (this.configuration.enforceSameFrameOfReference &&
+                sourceViewport.getFrameOfReferenceUID() !==
+                    targetViewport.getFrameOfReferenceUID()) {
+                return renderStatus;
+            }
+            const styleSpecifier = {
+                toolGroupId: this.toolGroupId,
+                toolName: this.getToolName(),
+                viewportId: enabledElement.viewport.id,
+            };
+            const topLeft = annotation.data.handles.points[0];
+            const topRight = annotation.data.handles.points[1];
+            const bottomLeft = annotation.data.handles.points[2];
+            const bottomRight = annotation.data.handles.points[3];
+            const { focalPoint, viewPlaneNormal, viewUp } = targetViewport.getCamera();
+            const { viewPlaneNormal: sourceViewPlaneNormal } = sourceViewport.getCamera();
+            if (this.isParallel(viewPlaneNormal, sourceViewPlaneNormal)) {
+                return renderStatus;
+            }
+            const targetViewportPlane = csUtils.planar.planeEquation(viewPlaneNormal, focalPoint);
+            const pointSet1 = [topLeft, bottomLeft, topRight, bottomRight];
+            const pointSet2 = [topLeft, topRight, bottomLeft, bottomRight];
+            let pointSetToUse = pointSet1;
+            let topBottomVec = vec3.subtract(vec3.create(), pointSet1[0], pointSet1[1]);
+            topBottomVec = vec3.normalize(vec3.create(), topBottomVec);
+            let topRightVec = vec3.subtract(vec3.create(), pointSet1[2], pointSet1[0]);
+            topRightVec = vec3.normalize(vec3.create(), topRightVec);
+            const newNormal = vec3.cross(vec3.create(), topBottomVec, topRightVec);
+            if (this.isParallel(newNormal, viewPlaneNormal)) {
+                return renderStatus;
+            }
+            if (this.isPerpendicular(topBottomVec, viewPlaneNormal)) {
+                pointSetToUse = pointSet2;
+            }
+            const lineStartWorld = csUtils.planar.linePlaneIntersection(pointSetToUse[0], pointSetToUse[1], targetViewportPlane);
+            const lineEndWorld = csUtils.planar.linePlaneIntersection(pointSetToUse[2], pointSetToUse[3], targetViewportPlane);
+            const { annotationUID } = annotation;
+            styleSpecifier.annotationUID = annotationUID;
+            const lineWidth = this.getStyle('lineWidth', styleSpecifier, annotation);
+            const lineDash = this.getStyle('lineDash', styleSpecifier, annotation);
+            const color = this.getStyle('color', styleSpecifier, annotation);
+            const shadow = this.getStyle('shadow', styleSpecifier, annotation);
+            let canvasCoordinates = [lineStartWorld, lineEndWorld].map((world) => targetViewport.worldToCanvas(world));
+            if (this.configuration.showFullDimension) {
+                canvasCoordinates = this.handleFullDimension(targetViewport, lineStartWorld, viewPlaneNormal, viewUp, lineEndWorld, canvasCoordinates);
+            }
+            if (canvasCoordinates.length < 2) {
+                return renderStatus;
+            }
+            const dataId = `${annotationUID}-line`;
+            const lineUID = '1';
+            drawLineSvg(svgDrawingHelper, annotationUID, lineUID, canvasCoordinates[0], canvasCoordinates[1], {
+                color,
+                width: lineWidth,
+                lineDash,
+                shadow,
+            }, dataId);
+            renderStatus = true;
+            return renderStatus;
+        };
+        this.isPerpendicular = (vec1, vec2) => {
+            const dot = vec3.dot(vec1, vec2);
+            return Math.abs(dot) < EPSILON;
+        };
+    }
+    handleFullDimension(targetViewport, lineStartWorld, viewPlaneNormal, viewUp, lineEndWorld, canvasCoordinates) {
+        const renderingEngine = targetViewport.getRenderingEngine();
+        const targetId = this.getTargetId(targetViewport);
+        const targetImage = this.getTargetImageData(targetId);
+        const referencedImageId = this.getReferencedImageId(targetViewport, lineStartWorld, viewPlaneNormal, viewUp);
+        if (referencedImageId && targetImage) {
+            try {
+                const { imageData, dimensions } = targetImage;
+                const [topLeftImageCoord, topRightImageCoord, bottomRightImageCoord, bottomLeftImageCoord,] = [
+                    imageData.indexToWorld([0, 0, 0]),
+                    imageData.indexToWorld([dimensions[0] - 1, 0, 0]),
+                    imageData.indexToWorld([
+                        dimensions[0] - 1,
+                        dimensions[1] - 1,
+                        0,
+                    ]),
+                    imageData.indexToWorld([0, dimensions[1] - 1, 0]),
+                ].map((world) => csUtils.worldToImageCoords(referencedImageId, world));
+                const [lineStartImageCoord, lineEndImageCoord] = [
+                    lineStartWorld,
+                    lineEndWorld,
+                ].map((world) => csUtils.worldToImageCoords(referencedImageId, world));
+                canvasCoordinates = [
+                    [topLeftImageCoord, topRightImageCoord],
+                    [topRightImageCoord, bottomRightImageCoord],
+                    [bottomLeftImageCoord, bottomRightImageCoord],
+                    [topLeftImageCoord, bottomLeftImageCoord],
+                ]
+                    .map(([start, end]) => this.intersectInfiniteLines(start, end, lineStartImageCoord, lineEndImageCoord))
+                    .filter((point) => point && this.isInBound(point, dimensions))
+                    .map((point) => {
+                    const world = csUtils.imageToWorldCoords(referencedImageId, point);
+                    return targetViewport.worldToCanvas(world);
+                });
+            }
+            catch (err) {
+                console.log(err);
+            }
+        }
+        return canvasCoordinates;
+    }
+    intersectInfiniteLines(line1Start, line1End, line2Start, line2End) {
+        const [x1, y1] = line1Start;
+        const [x2, y2] = line1End;
+        const [x3, y3] = line2Start;
+        const [x4, y4] = line2End;
+        const a1 = y2 - y1;
+        const b1 = x1 - x2;
+        const c1 = x2 * y1 - x1 * y2;
+        const a2 = y4 - y3;
+        const b2 = x3 - x4;
+        const c2 = x4 * y3 - x3 * y4;
+        if (Math.abs(a1 * b2 - a2 * b1) < EPSILON) {
+            return;
+        }
+        const x = (b1 * c2 - b2 * c1) / (a1 * b2 - a2 * b1);
+        const y = (a2 * c1 - a1 * c2) / (a1 * b2 - a2 * b1);
+        return [x, y];
+    }
+    isParallel(vec1, vec2) {
+        return Math.abs(vec3.dot(vec1, vec2)) > 1 - EPSILON;
+    }
+    isInBound(point, dimensions) {
+        return (point[0] >= 0 &&
+            point[0] <= dimensions[0] &&
+            point[1] >= 0 &&
+            point[1] <= dimensions[1]);
+    }
+}
+ReferenceLines.toolName = 'ReferenceLines';
+export default ReferenceLines;

package/dist/esm/tools/ScaleOverlayTool.d.ts

@@ -0,0 +1,38 @@
+import AnnotationDisplayTool from './base/AnnotationDisplayTool';
+import type { ScaleOverlayAnnotation } from '../types/ToolSpecificAnnotationTypes';
+import type { Types } from '@cornerstonejs/core';
+import type { PublicToolProps, ToolProps, SVGDrawingHelper } from '../types';
+declare class ScaleOverlayTool extends AnnotationDisplayTool {
+    static toolName: any;
+    _throttledCalculateCachedStats: Function;
+    editData: {
+        renderingEngine: Types.IRenderingEngine;
+        viewport: Types.IViewport;
+        annotation: ScaleOverlayAnnotation;
+    } | null;
+    isDrawing: boolean;
+    isHandleOutsideImage: boolean;
+    constructor(toolProps?: PublicToolProps, defaultToolProps?: ToolProps);
+    _init: () => void;
+    onSetToolEnabled: () => void;
+    onCameraModified: (evt: Types.EventTypes.CameraModifiedEvent) => void;
+    renderAnnotation(enabledElement: Types.IEnabledElement, svgDrawingHelper: SVGDrawingHelper): boolean;
+    _getTextLines(scaleSize: number): string[] | undefined;
+    computeScaleSize: (worldWidthViewport: number, worldHeightViewport: number, location: string) => any;
+    computeEndScaleTicks: (canvasCoordinates: any, location: any) => {
+        endTick1: any[][];
+        endTick2: any[][];
+    };
+    computeInnerScaleTicks: (scaleSize: number, location: string, annotationUID: string, leftTick: Types.Point2[], rightTick: Types.Point2[]) => {
+        tickIds: any[];
+        tickUIDs: any[];
+        tickCoordinates: any[];
+    };
+    computeWorldScaleCoordinates: (scaleSize: any, location: any, pointSet: any) => any;
+    computeCanvasScaleCoordinates: (canvasSize: any, canvasCoordinates: any, vscaleBounds: any, hscaleBounds: any, location: any) => any;
+    computeScaleBounds: (canvasSize: any, horizontalReduction: any, verticalReduction: any, location: any) => {
+        height: any;
+        width: any;
+    };
+}
+export default ScaleOverlayTool;

package/dist/esm/tools/ScaleOverlayTool.js

@@ -0,0 +1,397 @@
+import AnnotationDisplayTool from './base/AnnotationDisplayTool';
+import { vec3 } from 'gl-matrix';
+import { getEnabledElementByIds, getRenderingEngines, utilities as csUtils, } from '@cornerstonejs/core';
+import { addAnnotation, getAnnotations, } from '../stateManagement/annotation/annotationState';
+import { drawLine as drawLineSvg, drawTextBox as drawTextBoxSvg, } from '../drawingSvg';
+import { getToolGroup } from '../store/ToolGroupManager';
+const viewportsWithAnnotations = [];
+class ScaleOverlayTool extends AnnotationDisplayTool {
+    constructor(toolProps = {}, defaultToolProps = {
+        configuration: {
+            viewportId: '',
+            scaleLocation: 'bottom',
+        },
+    }) {
+        super(toolProps, defaultToolProps);
+        this.editData = null;
+        this._init = () => {
+            const renderingEngines = getRenderingEngines();
+            const renderingEngine = renderingEngines[0];
+            if (!renderingEngine) {
+                return;
+            }
+            const viewportIds = getToolGroup(this.toolGroupId).viewportsInfo;
+            if (!viewportIds) {
+                return;
+            }
+            const enabledElements = viewportIds.map((e) => getEnabledElementByIds(e.viewportId, e.renderingEngineId));
+            let { viewport } = enabledElements[0];
+            const { FrameOfReferenceUID } = enabledElements[0];
+            if (this.configuration.viewportId) {
+                enabledElements.forEach((element) => {
+                    if (element.viewport.id == this.configuration.viewportId) {
+                        viewport = element.viewport;
+                    }
+                });
+            }
+            if (!viewport) {
+                return;
+            }
+            const { viewUp, viewPlaneNormal } = viewport.getCamera();
+            const viewportCanvasCornersInWorld = csUtils.getViewportImageCornersInWorld(viewport);
+            let annotation = this.editData?.annotation;
+            const annotations = getAnnotations(this.getToolName(), viewport.element);
+            if (annotations.length) {
+                annotation = annotations.filter((thisAnnotation) => thisAnnotation.data.viewportId == viewport.id)[0];
+            }
+            enabledElements.forEach((element) => {
+                const { viewport } = element;
+                if (!viewportsWithAnnotations.includes(viewport.id)) {
+                    const newAnnotation = {
+                        metadata: {
+                            toolName: this.getToolName(),
+                            viewPlaneNormal: [...viewPlaneNormal],
+                            viewUp: [...viewUp],
+                            FrameOfReferenceUID,
+                            referencedImageId: null,
+                        },
+                        data: {
+                            handles: {
+                                points: csUtils.getViewportImageCornersInWorld(viewport),
+                            },
+                            viewportId: viewport.id,
+                        },
+                    };
+                    viewportsWithAnnotations.push(viewport.id);
+                    addAnnotation(newAnnotation, viewport.element);
+                    annotation = newAnnotation;
+                }
+            });
+            if (this.editData?.annotation &&
+                this.editData.annotation.data.viewportId == viewport.id) {
+                this.editData.annotation.data.handles.points =
+                    viewportCanvasCornersInWorld;
+                this.editData.annotation.data.viewportId = viewport.id;
+            }
+            this.editData = {
+                viewport,
+                renderingEngine,
+                annotation,
+            };
+        };
+        this.onSetToolEnabled = () => {
+            this._init();
+        };
+        this.onCameraModified = (evt) => {
+            this.configuration.viewportId = evt.detail.viewportId;
+            this._init();
+        };
+        this.computeScaleSize = (worldWidthViewport, worldHeightViewport, location) => {
+            const scaleSizes = [
+                16000, 8000, 4000, 2000, 1000, 500, 250, 100, 50, 25, 10, 5, 2,
+            ];
+            let currentScaleSize;
+            if (location == 'top' || location == 'bottom') {
+                currentScaleSize = scaleSizes.filter((scaleSize) => scaleSize < worldWidthViewport * 0.6 &&
+                    scaleSize > worldWidthViewport * 0.2);
+            }
+            else {
+                currentScaleSize = scaleSizes.filter((scaleSize) => scaleSize < worldHeightViewport * 0.6 &&
+                    scaleSize > worldHeightViewport * 0.2);
+            }
+            return currentScaleSize[0];
+        };
+        this.computeEndScaleTicks = (canvasCoordinates, location) => {
+            const locationTickOffset = {
+                bottom: [
+                    [0, -10],
+                    [0, -10],
+                ],
+                top: [
+                    [0, 10],
+                    [0, 10],
+                ],
+                left: [
+                    [0, 0],
+                    [10, 0],
+                ],
+                right: [
+                    [0, 0],
+                    [-10, 0],
+                ],
+            };
+            const endTick1 = [
+                [
+                    canvasCoordinates[1][0] + locationTickOffset[location][0][0],
+                    canvasCoordinates[1][1] + locationTickOffset[location][0][0],
+                ],
+                [
+                    canvasCoordinates[1][0] + locationTickOffset[location][1][0],
+                    canvasCoordinates[1][1] + locationTickOffset[location][1][1],
+                ],
+            ];
+            const endTick2 = [
+                [
+                    canvasCoordinates[0][0] + locationTickOffset[location][0][0],
+                    canvasCoordinates[0][1] + locationTickOffset[location][0][0],
+                ],
+                [
+                    canvasCoordinates[0][0] + locationTickOffset[location][1][0],
+                    canvasCoordinates[0][1] + locationTickOffset[location][1][1],
+                ],
+            ];
+            return {
+                endTick1: endTick1,
+                endTick2: endTick2,
+            };
+        };
+        this.computeInnerScaleTicks = (scaleSize, location, annotationUID, leftTick, rightTick) => {
+            let canvasScaleSize;
+            if (location == 'bottom' || location == 'top') {
+                canvasScaleSize = rightTick[0][0] - leftTick[0][0];
+            }
+            else if (location == 'left' || location == 'right') {
+                canvasScaleSize = rightTick[0][1] - leftTick[0][1];
+            }
+            const tickIds = [];
+            const tickUIDs = [];
+            const tickCoordinates = [];
+            let numberSmallTicks = scaleSize;
+            if (scaleSize >= 50) {
+                numberSmallTicks = scaleSize / 10;
+            }
+            const tickSpacing = canvasScaleSize / numberSmallTicks;
+            for (let i = 0; i < numberSmallTicks - 1; i++) {
+                const locationOffset = {
+                    bottom: [
+                        [tickSpacing * (i + 1), 0],
+                        [tickSpacing * (i + 1), 5],
+                    ],
+                    top: [
+                        [tickSpacing * (i + 1), 0],
+                        [tickSpacing * (i + 1), -5],
+                    ],
+                    left: [
+                        [0, tickSpacing * (i + 1)],
+                        [-5, tickSpacing * (i + 1)],
+                    ],
+                    right: [
+                        [0, tickSpacing * (i + 1)],
+                        [5, tickSpacing * (i + 1)],
+                    ],
+                };
+                tickIds.push(`${annotationUID}-tick${i}`);
+                tickUIDs.push(`tick${i}`);
+                if ((i + 1) % 5 == 0) {
+                    tickCoordinates.push([
+                        [
+                            leftTick[0][0] + locationOffset[location][0][0],
+                            leftTick[0][1] + locationOffset[location][0][1],
+                        ],
+                        [
+                            leftTick[1][0] + locationOffset[location][0][0],
+                            leftTick[1][1] + locationOffset[location][0][1],
+                        ],
+                    ]);
+                }
+                else {
+                    tickCoordinates.push([
+                        [
+                            leftTick[0][0] + locationOffset[location][0][0],
+                            leftTick[0][1] + locationOffset[location][0][1],
+                        ],
+                        [
+                            leftTick[1][0] + locationOffset[location][1][0],
+                            leftTick[1][1] + locationOffset[location][1][1],
+                        ],
+                    ]);
+                }
+            }
+            return { tickIds, tickUIDs, tickCoordinates };
+        };
+        this.computeWorldScaleCoordinates = (scaleSize, location, pointSet) => {
+            let worldCoordinates;
+            let topBottomVec = vec3.subtract(vec3.create(), pointSet[0], pointSet[1]);
+            topBottomVec = vec3.normalize(vec3.create(), topBottomVec);
+            let topRightVec = vec3.subtract(vec3.create(), pointSet[2], pointSet[0]);
+            topRightVec = vec3.normalize(vec3.create(), topRightVec);
+            const midpointLocation = {
+                bottom: [pointSet[1], pointSet[2]],
+                top: [pointSet[0], pointSet[3]],
+                right: [pointSet[2], pointSet[3]],
+                left: [pointSet[0], pointSet[1]],
+            };
+            const midpoint = vec3
+                .add(vec3.create(), midpointLocation[location][0], midpointLocation[location][0])
+                .map((i) => i / 2);
+            const offset = scaleSize /
+                2 /
+                Math.sqrt(Math.pow(topBottomVec[0], 2) +
+                    Math.pow(topBottomVec[1], 2) +
+                    Math.pow(topBottomVec[2], 2));
+            if (location == 'top' || location == 'bottom') {
+                worldCoordinates = [
+                    vec3.subtract(vec3.create(), midpoint, topRightVec.map((i) => i * offset)),
+                    vec3.add(vec3.create(), midpoint, topRightVec.map((i) => i * offset)),
+                ];
+            }
+            else if (location == 'left' || location == 'right') {
+                worldCoordinates = [
+                    vec3.add(vec3.create(), midpoint, topBottomVec.map((i) => i * offset)),
+                    vec3.subtract(vec3.create(), midpoint, topBottomVec.map((i) => i * offset)),
+                ];
+            }
+            return worldCoordinates;
+        };
+        this.computeCanvasScaleCoordinates = (canvasSize, canvasCoordinates, vscaleBounds, hscaleBounds, location) => {
+            let scaleCanvasCoordinates;
+            if (location == 'top' || location == 'bottom') {
+                const worldDistanceOnCanvas = canvasCoordinates[0][0] - canvasCoordinates[1][0];
+                scaleCanvasCoordinates = [
+                    [canvasSize.width / 2 - worldDistanceOnCanvas / 2, vscaleBounds.height],
+                    [canvasSize.width / 2 + worldDistanceOnCanvas / 2, vscaleBounds.height],
+                ];
+            }
+            else if (location == 'left' || location == 'right') {
+                const worldDistanceOnCanvas = canvasCoordinates[0][1] - canvasCoordinates[1][1];
+                scaleCanvasCoordinates = [
+                    [hscaleBounds.width, canvasSize.height / 2 - worldDistanceOnCanvas / 2],
+                    [hscaleBounds.width, canvasSize.height / 2 + worldDistanceOnCanvas / 2],
+                ];
+            }
+            return scaleCanvasCoordinates;
+        };
+        this.computeScaleBounds = (canvasSize, horizontalReduction, verticalReduction, location) => {
+            const hReduction = horizontalReduction * Math.min(1000, canvasSize.width);
+            const vReduction = verticalReduction * Math.min(1000, canvasSize.height);
+            const locationBounds = {
+                bottom: [-vReduction, -hReduction],
+                top: [vReduction, hReduction],
+                left: [vReduction, hReduction],
+                right: [-vReduction, -hReduction],
+            };
+            const canvasBounds = {
+                bottom: [canvasSize.height, canvasSize.width],
+                top: [0, canvasSize.width],
+                left: [canvasSize.height, 0],
+                right: [canvasSize.height, canvasSize.width],
+            };
+            return {
+                height: canvasBounds[location][0] + locationBounds[location][0],
+                width: canvasBounds[location][1] + locationBounds[location][1],
+            };
+        };
+    }
+    renderAnnotation(enabledElement, svgDrawingHelper) {
+        if (!this.editData || !this.editData.viewport) {
+            return;
+        }
+        const location = this.configuration.scaleLocation;
+        const { viewport } = enabledElement;
+        const annotations = getAnnotations(this.getToolName(), viewport.element);
+        const annotation = annotations.filter((thisAnnotation) => thisAnnotation.data.viewportId == viewport.id)[0];
+        const canvas = enabledElement.viewport.canvas;
+        const renderStatus = false;
+        if (!viewport) {
+            return renderStatus;
+        }
+        const styleSpecifier = {
+            toolGroupId: this.toolGroupId,
+            toolName: this.getToolName(),
+            viewportId: enabledElement.viewport.id,
+        };
+        const canvasSize = {
+            width: canvas.width / window.devicePixelRatio || 1,
+            height: canvas.height / window.devicePixelRatio || 1,
+        };
+        const topLeft = annotation.data.handles.points[0];
+        const topRight = annotation.data.handles.points[1];
+        const bottomLeft = annotation.data.handles.points[2];
+        const bottomRight = annotation.data.handles.points[3];
+        const pointSet1 = [topLeft, bottomLeft, topRight, bottomRight];
+        const worldWidthViewport = vec3.distance(bottomLeft, bottomRight);
+        const worldHeightViewport = vec3.distance(topLeft, bottomLeft);
+        const hscaleBounds = this.computeScaleBounds(canvasSize, 0.05, 0.05, location);
+        const vscaleBounds = this.computeScaleBounds(canvasSize, 0.05, 0.05, location);
+        const scaleSize = this.computeScaleSize(worldWidthViewport, worldHeightViewport, location);
+        const canvasCoordinates = this.computeWorldScaleCoordinates(scaleSize, location, pointSet1).map((world) => viewport.worldToCanvas(world));
+        const scaleCanvasCoordinates = this.computeCanvasScaleCoordinates(canvasSize, canvasCoordinates, vscaleBounds, hscaleBounds, location);
+        const scaleTicks = this.computeEndScaleTicks(scaleCanvasCoordinates, location);
+        const { annotationUID } = annotation;
+        styleSpecifier.annotationUID = annotationUID;
+        const lineWidth = this.getStyle('lineWidth', styleSpecifier, annotation);
+        const lineDash = this.getStyle('lineDash', styleSpecifier, annotation);
+        const color = this.getStyle('color', styleSpecifier, annotation);
+        const shadow = this.getStyle('shadow', styleSpecifier, annotation);
+        const scaleId = `${annotationUID}-scaleline`;
+        const scaleLineUID = '1';
+        drawLineSvg(svgDrawingHelper, annotationUID, scaleLineUID, scaleCanvasCoordinates[0], scaleCanvasCoordinates[1], {
+            color,
+            width: lineWidth,
+            lineDash,
+            shadow,
+        }, scaleId);
+        const leftTickId = `${annotationUID}-left`;
+        const leftTickUID = '2';
+        drawLineSvg(svgDrawingHelper, annotationUID, leftTickUID, scaleTicks.endTick1[0], scaleTicks.endTick1[1], {
+            color,
+            width: lineWidth,
+            lineDash,
+            shadow,
+        }, leftTickId);
+        const rightTickId = `${annotationUID}-right`;
+        const rightTickUID = '3';
+        drawLineSvg(svgDrawingHelper, annotationUID, rightTickUID, scaleTicks.endTick2[0], scaleTicks.endTick2[1], {
+            color,
+            width: lineWidth,
+            lineDash,
+            shadow,
+        }, rightTickId);
+        const locationTextOffest = {
+            bottom: [-10, -42],
+            top: [-12, -35],
+            left: [-40, -20],
+            right: [-50, -20],
+        };
+        const textCanvasCoordinates = [
+            scaleCanvasCoordinates[0][0] + locationTextOffest[location][0],
+            scaleCanvasCoordinates[0][1] + locationTextOffest[location][1],
+        ];
+        const textBoxLines = this._getTextLines(scaleSize);
+        const { tickIds, tickUIDs, tickCoordinates } = this.computeInnerScaleTicks(scaleSize, location, annotationUID, scaleTicks.endTick1, scaleTicks.endTick2);
+        for (let i = 0; i < tickUIDs.length; i++) {
+            drawLineSvg(svgDrawingHelper, annotationUID, tickUIDs[i], tickCoordinates[i][0], tickCoordinates[i][1], {
+                color,
+                width: lineWidth,
+                lineDash,
+                shadow,
+            }, tickIds[i]);
+        }
+        const textUID = 'text0';
+        drawTextBoxSvg(svgDrawingHelper, annotationUID, textUID, textBoxLines, [textCanvasCoordinates[0], textCanvasCoordinates[1]], {
+            fontFamily: 'Helvetica Neue, Helvetica, Arial, sans-serif',
+            fontSize: '14px',
+            lineDash: '2,3',
+            lineWidth: '1',
+            shadow: true,
+            color: color,
+        });
+        return renderStatus;
+    }
+    _getTextLines(scaleSize) {
+        let scaleSizeDisplayValue;
+        let scaleSizeUnits;
+        if (scaleSize >= 50) {
+            scaleSizeDisplayValue = scaleSize / 10;
+            scaleSizeUnits = ' cm';
+        }
+        else {
+            scaleSizeDisplayValue = scaleSize;
+            scaleSizeUnits = ' mm';
+        }
+        const textLines = [scaleSizeDisplayValue.toString().concat(scaleSizeUnits)];
+        return textLines;
+    }
+}
+ScaleOverlayTool.toolName = 'ScaleOverlay';
+export default ScaleOverlayTool;