Overlay tool shows overlays is not complete

[myousefipour]

Hi thanks for the excellent work. I have a problem with the overlay show. my overlay and my base image (512 x 512), But overlay is displayed up to 370 x 370. These are my objects Overlay: overlayData.overlays.push({ rows: 512, columns: 512, type: '', x: 0, y: 0, pixelData: pixedlData, description: undefined, label: undefined, roiArea: undefined, roiMean: undefined, roiStandardDeviation: undefined, fillStyle: 'red', visible: true }); Image : cachedLut: {lutArray: Uint8ClampedArray(4156), windowWidth: 400, windowCenter: 40, invert: false, voiLUT: undefined, …} color: false columnPixelSpacing: 0.646484 columns: 512 data: n {byteArrayParser: {…}, byteArray: Uint8Array(197792), elements: {…}, warnings: Array(0)} decodeTimeInMS: 78 floatPixelData: undefined getPixelData: ƒ () height: 512 imageId: "" intercept: -1024 invert: false loadTimeInMS: 1492 maxPixelValue: 2155 minPixelValue: -2000 rowPixelSpacing: 0.646484 rows: 512 sharedCacheKey: "" sizeInBytes: 524288 slope: 1 stats: {lastGetPixelDataTime: -1, lastStoredPixelDataToCanvasImageDataTime: -1, lastPutImageDataTime: -1, lastRenderTime: 0.09499999950639904, lastLutGenerateTime: -1} totalTimeInMS: 1573 width: 512 windowCenter: 40 windowWidth: 400

[carlos-actualmed]

We have found the same problem it's because on cornerstoneTools.js to calculate the imageWidth and imageHeight of the layerCanvas for the overlay it uses the viewportPixelSpacing values I don't know why, and that makes the layer to be reduced.

The problem

cornerstoneTools.js

19533: var imageWidth = Math.abs(viewport.displayedArea.brhc.x - viewport.displayedArea.tlhc.x) * viewportPixelSpacing.column;
19534: var imageHeight = Math.abs(viewport.displayedArea.brhc.y - viewport.displayedArea.tlhc.y) * viewportPixelSpacing.row;

Viewport

{scale: 1.1800486618004866, translation: {…}, voi: {…}, invert: false, pixelReplication: false, …}
colormap: undefined
displayedArea:
brhc: {x: 822, y: 512}
columnPixelSpacing: 0.37344921
presentationSizeMode: "NONE"
rowPixelSpacing: 0.37344921
tlhc: {x: 1, y: 1}
__proto__: Object
hflip: false
invert: false
labelmap: false
modalityLUT: undefined
pixelReplication: false
rotation: 0
scale: 1.1800486618004866
translation: {x: 0, y: 0}
vflip: false
voi: {windowWidth: 1388, windowCenter: 238}
voiLUT: undefined
__proto__: Object

How to fix it

To solve it you have to change those lines to:

19533: var imageWidth = viewport.displayedArea.brhc.x;
19534: var imageHeight = viewport.displayedArea.brhc.y;

I don't understand why the displayedArea is being multiplied by the pixelSpacing, but that causes the error.

Screenshots

Before After