larvitar 1.5.13 → 2.0.0

package/imaging/loaders/{nrrdLoader.js → nrrdLoader.ts}

@@ -8,6 +8,7 @@ import cornerstone from "cornerstone-core";
 import { default as cornerstoneDICOMImageLoader } from "cornerstone-wado-image-loader";
 import { each, clone, range, findKey, filter, pickBy } from "lodash";
 import { v4 as uuidv4 } from "uuid";
+import { ImageLoader } from "cornerstone-core";
 
 // internal libraries
 import {
@@ -21,6 +22,16 @@ import {
   getLarvitarImageTracker,
   getLarvitarManager
 } from "./commonLoader";
+import type {
+  Image,
+  Instance,
+  Volume,
+  LarvitarManager,
+  ImageFrame,
+  ImageTracker,
+  MetaData
+} from "../types";
+import { DataSet } from "dicom-parser";
 
 // global module variables
 let customImageLoaderCounter = 0;
@@ -35,6 +46,79 @@ let customImageLoaderCounter = 0;
  * getNrrdSerieDimensions()
  */
 
+type NrrdInputVolume = {
+  header: {
+    sizes: number[];
+    "space directions": number[][]; // a property with a space in the name ?? Seriously ??
+    "space origin": [number, number];
+    kinds: string[];
+    type: string;
+  };
+  data: Uint16Array; // TODO-ts: other typed arrays ?
+};
+
+export type NrrdSeries = {
+  currentImageIdIndex: number;
+  imageIds: string[];
+  instances: { [key: string]: Instance };
+  instanceUIDs: { [key: string]: string };
+  numberOfImages: number;
+  seriesDescription: string;
+  seriesUID: string;
+  customLoader: string;
+  nrrdHeader: NrrdHeader;
+  bytes: number;
+  dataSet?: DataSet;
+  metadata?: MetaData;
+};
+
+type NrrdHeader = {
+  volume: Volume;
+  intercept: number;
+  slope: number;
+  repr: string;
+  phase: string;
+  study_description: string;
+  series_description: string;
+  acquisition_date: string;
+  [imageId: string]: string | number | Volume | NrrdInstance; // TODO-ts: fix this: we need just NrrdInstance
+};
+
+type NrrdInstance = {
+  instanceUID: string;
+  seriesDescription: string;
+  seriesModality: string;
+  patientName: string;
+  bitsAllocated: number;
+  pixelRepresentation: string;
+};
+
+// TODO-ts: why it's different from cornerstone type ?
+// type Image = {
+//   imageId: string;
+//   rows: number;
+//   columns: number;
+//   minPixelValue: number;
+//   maxPixelValue: number;
+//   slope: number;
+//   intercept: number;
+//   windowCenter: number;
+//   windowWidth: number;
+//   render?: Function;
+//   getPixelData?: Function;
+//   getCanvas?: Function;
+//   color: boolean;
+//   columnPixelSpacing: number;
+//   rowPixelSpacing: number;
+//   invert: boolean;
+//   sizeInBytes: number;
+//   height: number;
+//   width: number;
+//   decodeTimeInMS?: number;
+//   webWorkerTimeInMS?: number;
+//   metadata: {[key: string]: MetadataValue};
+// }
+
 /**
  * Build the data structure for the provided image orientation
  * @instance
@@ -44,12 +128,17 @@ let customImageLoaderCounter = 0;
  * @param {Object} custom_header A custom header object
  * @return {Object} volume data
  */
-export const buildNrrdImage = function (volume, seriesId, custom_header) {
+export const buildNrrdImage = function (
+  volume: NrrdInputVolume,
+  seriesId: string,
+  custom_header: NrrdHeader
+) {
+  //TODO-ts: better definition
   let t0 = performance.now();
   // standard image structure
-  let image = {};
-  let manager = getLarvitarManager();
-  let imageTracker = getLarvitarImageTracker();
+  let image: Partial<NrrdSeries> = {};
+  let manager = getLarvitarManager() as LarvitarManager;
+  let imageTracker = getLarvitarImageTracker() as ImageTracker;
   image.currentImageIdIndex = 0;
   image.imageIds = [];
   image.instances = {};
@@ -57,8 +146,8 @@ export const buildNrrdImage = function (volume, seriesId, custom_header) {
   image.seriesDescription = "";
   image.seriesUID = seriesId;
 
-  let header = {};
-  header["volume"] = {};
+  let header: Partial<NrrdHeader> = {};
+  header.volume = {} as Volume;
   // need to extract header from nrrd file format
   // sizes, spaceDirections and spaceOrigin
 
@@ -96,9 +185,9 @@ export const buildNrrdImage = function (volume, seriesId, custom_header) {
   header.volume.sliceThickness = spacing_z;
   header.volume.repr =
     volume.header.type[0].toUpperCase() + volume.header.type.slice(1);
-  header.volume.intercept = custom_header ? custom_header.intercept : null;
-  header.volume.slope = custom_header ? custom_header.slope : null;
-  header.volume.phase = custom_header ? custom_header.phase : null;
+  header.volume.intercept = custom_header ? custom_header.intercept : 0;
+  header.volume.slope = custom_header ? custom_header.slope : 1;
+  header.volume.phase = custom_header ? custom_header.phase : "";
   header.volume.study_description = custom_header
     ? custom_header.study_description
     : "";
@@ -112,9 +201,13 @@ export const buildNrrdImage = function (volume, seriesId, custom_header) {
   let rows = volume.header.sizes[index + 1];
   let cols = volume.header.sizes[index + 0];
   let frames = volume.header.sizes[index + 2];
-  let iop = volume.header["space directions"][index + 0].concat(
+  let iopArr = volume.header["space directions"][index + 0].concat(
     volume.header["space directions"][index + 1]
   );
+  if (iopArr.length !== 6) {
+    throw new Error("Invalid Image Orientation");
+  }
+  let iop = iopArr as [number, number, number, number, number, number];
   let firstIpp = header.volume.imagePosition;
   let w = getNormalOrientation(iop);
   let ps = header.volume.pixelSpacing;
@@ -122,7 +215,7 @@ export const buildNrrdImage = function (volume, seriesId, custom_header) {
   let intercept = header.volume.intercept;
   let slope = header.volume.slope;
 
-  let metadata = {
+  let metadata: Partial<Instance["metadata"]> = {
     x00280010: rows, // Rows
     x00280011: cols, // Columns
     x00200037: iop, // ImageOrientationPatient
@@ -131,30 +224,34 @@ export const buildNrrdImage = function (volume, seriesId, custom_header) {
     x00281052: intercept ? [intercept] : [0],
     x00281053: slope ? [slope] : [1],
     x00200052: header.volume.imageIds
-      ? header[header.volume.imageIds[0]].instanceUID
+      ? (header[header.volume.imageIds[0]] as NrrdInstance).instanceUID
       : null,
     x0008103e: header.volume.imageIds
-      ? header[header.volume.imageIds[0]].seriesDescription
+      ? (header[header.volume.imageIds[0]] as NrrdInstance).seriesDescription
       : null,
     x00080060: header.volume.imageIds
-      ? header[header.volume.imageIds[0]].seriesModality
+      ? (header[header.volume.imageIds[0]] as NrrdInstance).seriesModality
       : null,
     x00100010: header.volume.imageIds
-      ? header[header.volume.imageIds[0]].patientName
+      ? (header[header.volume.imageIds[0]] as NrrdInstance).patientName
       : null,
     x00280100: header.volume.imageIds
-      ? header[header.volume.imageIds[0]].bitsAllocated
+      ? (header[header.volume.imageIds[0]] as NrrdInstance).bitsAllocated
       : null,
     x00280103: header.volume.imageIds
-      ? header[header.volume.imageIds[0]].pixelRepresentation
+      ? (header[header.volume.imageIds[0]] as NrrdInstance).pixelRepresentation
       : null,
     repr: header.volume.repr || null
   };
 
   // compute default ww/wl values here to use them also for resliced images
   let minMax = cornerstoneDICOMImageLoader.getMinMax(volume.data);
-  let maxVoi = minMax.max * metadata.x00281053[0] + metadata.x00281052[0];
-  let minVoi = minMax.min * metadata.x00281053[0] + metadata.x00281052[0];
+  let maxVoi =
+    minMax.max * (metadata.x00281053 as number[])[0] +
+    (metadata.x00281052 as number[])[0];
+  let minVoi =
+    minMax.min * (metadata.x00281053 as number[])[0] +
+    (metadata.x00281052 as number[])[0];
   let ww = maxVoi - minVoi;
   let wl = (maxVoi + minVoi) / 2;
 
@@ -162,35 +259,49 @@ export const buildNrrdImage = function (volume, seriesId, custom_header) {
   metadata.x00280107 = minMax.max;
 
   // extract the pixelData of each frame, store the data into the image object
-  each(range(frames), function (sliceIndex) {
+  each(range(frames), function (sliceIndex: number) {
     let sliceSize = rows * cols;
     let sliceBuffer = volume.data.subarray(
       sliceSize * sliceIndex,
       sliceSize * (sliceIndex + 1)
     );
+
+    if (!metadata) {
+      throw new Error("Metadata not found");
+    }
+
+    // @ts-ignore: TODO this is concepptually wrong, we already know the Pixel Representation
+    // (see above, line 241), this function just returns the same value again
     let r = getPixelRepresentation(metadata);
     let typedArray = getTypedArrayFromDataType(r);
+
+    if (!typedArray) {
+      throw new Error("Typed array not found");
+    }
+
     let pixelData = new typedArray(sliceBuffer);
     // assign these values to the metadata of all images
     metadata.x00281050 = wl;
     metadata.x00281051 = ww;
 
     let imageId = getNrrdImageId("nrrdLoader");
+    if (!imageTracker) {
+      throw new Error("Image tracker not initialized");
+    }
     imageTracker[imageId] = seriesId;
 
     // store file references
-    image.imageIds.push(imageId);
-    image.instances[imageId] = {
-      instanceId: uuidv4(),
-      frame: sliceIndex
-    };
-    let frameMetadata = clone(metadata);
-
+    image.imageIds!.push(imageId);
+    let frameMetadata: MetaData = clone(metadata);
     frameMetadata.x00200032 = firstIpp.map(function (val, i) {
       return val + thickness * sliceIndex * w[i];
     });
-    image.instances[imageId].metadata = frameMetadata;
-    image.instances[imageId].pixelData = pixelData;
+    image.instances![imageId] = {
+      instanceId: uuidv4(),
+      frame: sliceIndex,
+      metadata: frameMetadata,
+      pixelData: pixelData
+    };
   });
 
   let middleSlice = Math.floor(image.imageIds.length / 2);
@@ -199,9 +310,13 @@ export const buildNrrdImage = function (volume, seriesId, custom_header) {
   // specify custom loader type and attach original header
   image.customLoader = "nrrdLoader";
   header.volume.imageIds = image.imageIds;
-  image.nrrdHeader = header;
+  image.nrrdHeader = header as NrrdHeader;
+
+  if (!manager) {
+    throw new Error("Larvitar manager not initialized");
+  }
 
-  manager[seriesId] = image;
+  manager[seriesId] = image as NrrdSeries;
 
   let t1 = performance.now();
   console.log(`Call to buildNrrdImage took ${t1 - t0} milliseconds.`);
@@ -215,7 +330,7 @@ export const buildNrrdImage = function (volume, seriesId, custom_header) {
  * @param {String} customLoaderName The custom loader name
  * @return {String} the custom image id
  */
-export const getNrrdImageId = function (customLoaderName) {
+export const getNrrdImageId = function (customLoaderName: string) {
   let imageId = customLoaderName + "://" + customImageLoaderCounter;
   customImageLoaderCounter++;
   return imageId;
@@ -228,11 +343,15 @@ export const getNrrdImageId = function (customLoaderName) {
  * @param {String} imageId The image id
  * @return {Object} custom image object
  */
-export const loadNrrdImage = function (imageId) {
-  let manager = getLarvitarManager();
-  let imageTracker = getLarvitarImageTracker();
+export const loadNrrdImage: ImageLoader = function (imageId: string) {
+  let manager = getLarvitarManager() as LarvitarManager;
+  let imageTracker = getLarvitarImageTracker() as ImageTracker;
+  if (!manager || !imageTracker) {
+    throw new Error("Larvitar manager or image tracker not initialized");
+  }
   let seriesId = imageTracker[imageId];
   let instance = manager[seriesId].instances[imageId];
+  //@ts-ignore TODO-ts: fix this why is different typed array?
   return createCustomImage(imageId, instance.metadata, instance.pixelData);
 };
 
@@ -246,13 +365,13 @@ export const loadNrrdImage = function (imageId) {
  * @return {String} image id
  */
 export const getImageIdFromSlice = function (
-  sliceNumber,
-  orientation,
-  seriesId
+  sliceNumber: number,
+  orientation: string,
+  seriesId: string
 ) {
   var prefix = "nrrdLoader://";
   var serieImageTracker;
-  let imageTracker = getLarvitarImageTracker();
+  let imageTracker = getLarvitarImageTracker() as ImageTracker;
 
   if (seriesId) {
     serieImageTracker = pickBy(imageTracker, image => {
@@ -262,12 +381,18 @@ export const getImageIdFromSlice = function (
     serieImageTracker = imageTracker;
   }
 
-  var firstImageId = findKey(serieImageTracker, entry => {
+  var firstImageIdStr = findKey(serieImageTracker, entry => {
     return entry[1] == orientation;
   });
 
-  var imageIndex =
-    parseInt(firstImageId.split("//").pop()) + parseInt(sliceNumber);
+  let firstImageId = firstImageIdStr?.split("//").pop();
+
+  if (firstImageId == undefined) {
+    console.error("cannot find imageId for orientation: " + orientation);
+    return "";
+  }
+
+  var imageIndex = parseInt(firstImageId) + parseInt(sliceNumber.toString());
 
   var imageId = prefix.concat(imageIndex.toString());
 
@@ -283,16 +408,29 @@ export const getImageIdFromSlice = function (
  * @param {String} seriesId The series id
  * @return {Integer} The image slice number
  */
-export const getSliceNumberFromImageId = function (imageId, orientation) {
-  let imageTracker = getLarvitarImageTracker();
-  var firstImageId = findKey(imageTracker, entry => {
+export const getSliceNumberFromImageId = function (
+  imageId: string,
+  orientation: string
+) {
+  let imageTracker = getLarvitarImageTracker() as ImageTracker;
+  var firstImageIdStr = findKey(imageTracker, entry => {
     return entry[1] == orientation;
   });
 
+  if (firstImageIdStr == undefined) {
+    console.error("cannot find imageId for orientation: " + orientation);
+    return 0;
+  }
+
   var imageNumber = imageId.split("//").pop() || imageId;
+  let firstImageId = firstImageIdStr.split("//").pop();
 
-  var imageIndex =
-    parseInt(imageNumber) - parseInt(firstImageId.split("//").pop());
+  if (firstImageId == undefined) {
+    console.error("cannot find imageId for orientation: " + orientation);
+    return 0;
+  }
+
+  var imageIndex = parseInt(imageNumber) - parseInt(firstImageId);
 
   return imageIndex;
 };
@@ -304,7 +442,7 @@ export const getSliceNumberFromImageId = function (imageId, orientation) {
  * @return {Object} Series dimension for each view
  */
 export const getNrrdSerieDimensions = function () {
-  let imageTracker = getLarvitarImageTracker();
+  let imageTracker = getLarvitarImageTracker() as ImageTracker;
   var dim_axial = filter(imageTracker, img => {
     return img[1] == "axial";
   });
@@ -334,11 +472,17 @@ export const getNrrdSerieDimensions = function () {
  * @param {Object} dataSet The dataset
  * @return {String} The image id
  */
-let createCustomImage = function (imageId, metadata, pixelData, dataSet) {
+let createCustomImage = function (
+  imageId: string,
+  metadata: MetaData,
+  pixelData: Uint8ClampedArray,
+  dataSet?: any
+) {
+  //TODO-ts check this
   let canvas = window.document.createElement("canvas");
   let lastImageIdDrawn = "";
 
-  let imageFrame = getImageFrame(metadata, dataSet);
+  let imageFrame = getImageFrame(metadata, dataSet) as ImageFrame;
 
   // This function uses the pixelData received as argument without manipulating
   // them: if the image is compressed, the decompress function should be called
@@ -361,7 +505,7 @@ let createCustomImage = function (imageId, metadata, pixelData, dataSet) {
     );
   }
 
-  let image = {
+  let image: Partial<Image> = {
     imageId: imageId,
     color: cornerstoneDICOMImageLoader.isColorImage(
       imageFrame.photometricInterpretation
@@ -369,7 +513,7 @@ let createCustomImage = function (imageId, metadata, pixelData, dataSet) {
     columnPixelSpacing: pixelSpacing ? pixelSpacing[1] : undefined,
     columns: imageFrame.columns,
     height: imageFrame.rows,
-    intercept: rescaleIntercept ? rescaleIntercept[0] : 0,
+    intercept: rescaleIntercept ? (rescaleIntercept as number[])[0] : 0,
     invert: imageFrame.photometricInterpretation === "MONOCHROME1",
     minPixelValue: imageFrame.smallestPixelValue,
     maxPixelValue: imageFrame.largestPixelValue,
@@ -377,17 +521,21 @@ let createCustomImage = function (imageId, metadata, pixelData, dataSet) {
     rowPixelSpacing: pixelSpacing ? pixelSpacing[0] : undefined,
     rows: imageFrame.rows,
     sizeInBytes: getSizeInBytes(),
-    slope: rescaleSlope ? rescaleSlope[0] : 1,
+    slope: rescaleSlope ? (rescaleSlope as number[])[0] : 1,
     width: imageFrame.columns,
-    windowCenter: windowCenter ? windowCenter[0] : undefined,
-    windowWidth: windowWidth ? windowWidth[0] : undefined,
+    windowCenter: windowCenter ? (windowCenter as number[])[0] : undefined,
+    windowWidth: windowWidth ? (windowWidth as number[])[0] : undefined,
     decodeTimeInMS: undefined,
     webWorkerTimeInMS: undefined
   };
 
   // add function to return pixel data
   image.getPixelData = function () {
-    return imageFrame.pixelData;
+    if (!imageFrame.pixelData) {
+      console.warn('no pixel data for imageId "' + imageId);
+      return [];
+    }
+    return Array.from(imageFrame.pixelData);
   };
 
   // convert color space
@@ -397,6 +545,11 @@ let createCustomImage = function (imageId, metadata, pixelData, dataSet) {
     canvas.width = imageFrame.columns;
 
     let context = canvas.getContext("2d");
+
+    if (!context) {
+      throw new Error("Unable to get canvas context");
+    }
+
     let imageData = context.createImageData(
       imageFrame.columns,
       imageFrame.rows
@@ -415,10 +568,13 @@ let createCustomImage = function (imageId, metadata, pixelData, dataSet) {
         return canvas;
       }
 
-      canvas.height = image.rows;
-      canvas.width = image.columns;
+      canvas.height = image.rows || 0;
+      canvas.width = image.columns || 0;
       let context = canvas.getContext("2d");
-      context.putImageData(imageFrame.imageData, 0, 0);
+      if (!context) {
+        throw new Error("Unable to get canvas context");
+      }
+      context.putImageData(imageFrame.imageData!, 0, 0);
       lastImageIdDrawn = imageId;
       return canvas;
     };
@@ -436,13 +592,23 @@ let createCustomImage = function (imageId, metadata, pixelData, dataSet) {
   // set the ww/wc to cover the dynamic range of the image if no values are supplied
   if (image.windowCenter === undefined || image.windowWidth === undefined) {
     if (image.color) {
-      image.windowWidth = 255;
-      image.windowCenter = 128;
-    } else {
+      image.windowWidth = 255.0;
+      image.windowCenter = 127.5;
+    } else if (
+      image.maxPixelValue != null &&
+      image.minPixelValue != null &&
+      image.slope != null &&
+      image.intercept != null
+    ) {
       let maxVoi = image.maxPixelValue * image.slope + image.intercept;
       let minVoi = image.minPixelValue * image.slope + image.intercept;
       image.windowWidth = maxVoi - minVoi;
       image.windowCenter = (maxVoi + minVoi) / 2;
+    } else {
+      console.error(
+        "Unable to calculate default window width/center for imageId: " +
+          imageId
+      );
     }
   }
 
@@ -451,8 +617,8 @@ let createCustomImage = function (imageId, metadata, pixelData, dataSet) {
   // function to store custom image pixelData and metadata.
   image.metadata = metadata;
 
-  let promise = new Promise(function (resolve) {
-    resolve(image);
+  let promise: Promise<Image> = new Promise(function (resolve) {
+    resolve(image as Image);
   });
 
   // Return an object containing the Promise to cornerstone so it can setup callbacks to be

package/imaging/loaders/{resliceLoader.js → resliceLoader.ts}

@@ -13,6 +13,7 @@ import {
   getLarvitarImageTracker,
   getLarvitarManager
 } from "./commonLoader";
+import type { Image, ImageFrame, MetaData } from "../types";
 
 /*
  * This module provides the following functions to be exported:
@@ -20,18 +21,19 @@ import {
  */
 
 /**
- * Custom Loader for WadoImageLoader
+ * Custom Loader for DICOMImageLoader
  * @instance
  * @function loadReslicedImage
  * @param {String} imageId The Id of the image
  * @returns {Object} custom image object
  */
-export const loadReslicedImage = function (imageId) {
+export const loadReslicedImage = function (imageId: string) {
   let manager = getLarvitarManager();
   let imageTracker = getLarvitarImageTracker();
   let seriesId = imageTracker[imageId];
   let instance = manager[seriesId].instances[imageId];
   var reslicedPixeldata = instance.pixelData;
+  //@ts-ignore deprecated
   return createCustomImage(imageId, instance.metadata, reslicedPixeldata);
 };
 
@@ -47,11 +49,16 @@ export const loadReslicedImage = function (imageId) {
  * @param {Object} dataSet dataset object
  * @returns {Object} custom image object
  */
-let createCustomImage = function (imageId, metadata, pixelData, dataSet) {
+let createCustomImage = function (
+  imageId: string,
+  metadata: MetaData,
+  pixelData: Uint8ClampedArray,
+  dataSet?: any // deprecated
+) {
   let canvas = window.document.createElement("canvas");
   let lastImageIdDrawn = "";
 
-  let imageFrame = getImageFrame(metadata, dataSet);
+  let imageFrame = getImageFrame(metadata, dataSet) as ImageFrame;
 
   // This function uses the pixelData received as argument without manipulating
   // them: if the image is compressed, the decompress function should be called
@@ -74,33 +81,39 @@ let createCustomImage = function (imageId, metadata, pixelData, dataSet) {
     );
   }
 
-  let image = {
+  let image: Partial<Image> = {
     imageId: imageId,
     color: cornerstoneDICOMImageLoader.isColorImage(
       imageFrame.photometricInterpretation
     ),
-    columnPixelSpacing: pixelSpacing ? pixelSpacing[1] : undefined,
+    columnPixelSpacing: pixelSpacing
+      ? (pixelSpacing as number[])[1]
+      : undefined,
     columns: imageFrame.columns,
     height: imageFrame.rows,
-    intercept: rescaleIntercept ? rescaleIntercept : 0,
+    intercept: rescaleIntercept ? (rescaleIntercept as number) : 0,
     invert: imageFrame.photometricInterpretation === "MONOCHROME1",
     minPixelValue: imageFrame.smallestPixelValue,
     maxPixelValue: imageFrame.largestPixelValue,
     render: undefined, // set below
-    rowPixelSpacing: pixelSpacing ? pixelSpacing[0] : undefined,
+    rowPixelSpacing: pixelSpacing ? (pixelSpacing as number[])[0] : undefined,
     rows: imageFrame.rows,
     sizeInBytes: getSizeInBytes(),
-    slope: rescaleSlope ? rescaleSlope : 1,
+    slope: rescaleSlope ? (rescaleSlope as number) : 1,
     width: imageFrame.columns,
-    windowCenter: windowCenter ? windowCenter : undefined,
-    windowWidth: windowWidth ? windowWidth : undefined,
+    windowCenter: windowCenter ? (windowCenter as number) : undefined,
+    windowWidth: windowWidth ? (windowWidth as number) : undefined,
     decodeTimeInMS: undefined,
     webWorkerTimeInMS: undefined
   };
 
   // add function to return pixel data
   image.getPixelData = function () {
-    return imageFrame.pixelData;
+    if (!imageFrame.pixelData) {
+      console.warn('no pixel data for imageId "' + imageId);
+      return [];
+    }
+    return Array.from(imageFrame.pixelData);
   };
 
   // convert color space
@@ -110,6 +123,11 @@ let createCustomImage = function (imageId, metadata, pixelData, dataSet) {
     canvas.width = imageFrame.columns;
 
     let context = canvas.getContext("2d");
+
+    if (!context) {
+      throw new Error("Unable to get canvas context");
+    }
+
     let imageData = context.createImageData(
       imageFrame.columns,
       imageFrame.rows
@@ -128,10 +146,13 @@ let createCustomImage = function (imageId, metadata, pixelData, dataSet) {
         return canvas;
       }
 
-      canvas.height = image.rows;
-      canvas.width = image.columns;
+      canvas.height = image.rows || 0;
+      canvas.width = image.columns || 0;
       let context = canvas.getContext("2d");
-      context.putImageData(imageFrame.imageData, 0, 0);
+      if (!context) {
+        throw new Error("Unable to get canvas context");
+      }
+      context.putImageData(imageFrame.imageData!, 0, 0);
       lastImageIdDrawn = imageId;
       return canvas;
     };
@@ -147,13 +168,23 @@ let createCustomImage = function (imageId, metadata, pixelData, dataSet) {
   // set the ww/wc to cover the dynamic range of the image if no values are supplied
   if (image.windowCenter === undefined || image.windowWidth === undefined) {
     if (image.color) {
-      image.windowWidth = 255;
-      image.windowCenter = 128;
-    } else {
+      image.windowWidth = 255.0;
+      image.windowCenter = 127.5;
+    } else if (
+      image.maxPixelValue &&
+      image.minPixelValue &&
+      image.slope &&
+      image.intercept
+    ) {
       let maxVoi = image.maxPixelValue * image.slope + image.intercept;
       let minVoi = image.minPixelValue * image.slope + image.intercept;
       image.windowWidth = maxVoi - minVoi;
       image.windowCenter = (maxVoi + minVoi) / 2;
+    } else {
+      console.error(
+        "Unable to calculate default window width/center for imageId: " +
+          imageId
+      );
     }
   }
 
@@ -162,8 +193,8 @@ let createCustomImage = function (imageId, metadata, pixelData, dataSet) {
   // function to store custom image pixelData and metadata.
   image.metadata = metadata;
 
-  let promise = new Promise(function (resolve) {
-    resolve(image);
+  let promise: Promise<Image> = new Promise(function (resolve) {
+    resolve(image as Image);
   });
 
   // Return an object containing the Promise to cornerstone so it can setup callbacks to be