Volume3d

extensions/cornerstone/src/Viewport/Overlays/CornerstoneOverlays.tsx

@@ -7,6 +7,12 @@ import ViewportImageSliceLoadingIndicator from './ViewportImageSliceLoadingIndic
 
 function CornerstoneOverlays(props) {
   const { viewportIndex, element, scrollbarHeight, servicesManager } = props;
+  const {
+    disableViewportImageScrollbar,
+    disableViewportOverlay,
+    disableViewportImageSliceLoadingIndicator,
+    disableViewportOrientationMarkers,
+  } = props;
   const { cornerstoneViewportService } = servicesManager.services;
   const [imageSliceData, setImageSliceData] = useState({
     imageIndex: 0,
@@ -47,33 +53,41 @@ function CornerstoneOverlays(props) {
 
   return (
     <div className="noselect">
-      <ViewportImageScrollbar
-        viewportIndex={viewportIndex}
-        viewportData={viewportData}
-        element={element}
-        imageSliceData={imageSliceData}
-        setImageSliceData={setImageSliceData}
-        scrollbarHeight={scrollbarHeight}
-        servicesManager={servicesManager}
-      />
-      <ViewportOverlay
-        imageSliceData={imageSliceData}
-        viewportData={viewportData}
-        viewportIndex={viewportIndex}
-        servicesManager={servicesManager}
-        element={element}
-      />
-      <ViewportImageSliceLoadingIndicator
-        viewportData={viewportData}
-        element={element}
-      />
-      <ViewportOrientationMarkers
-        imageSliceData={imageSliceData}
-        element={element}
-        viewportData={viewportData}
-        servicesManager={servicesManager}
-        viewportIndex={viewportIndex}
-      />
+      {!disableViewportImageScrollbar && (
+        <ViewportImageScrollbar
+          viewportIndex={viewportIndex}
+          viewportData={viewportData}
+          element={element}
+          imageSliceData={imageSliceData}
+          setImageSliceData={setImageSliceData}
+          scrollbarHeight={scrollbarHeight}
+          servicesManager={servicesManager}
+        />
+      )}
+      {!disableViewportOverlay && (
+        <ViewportOverlay
+          imageSliceData={imageSliceData}
+          viewportData={viewportData}
+          viewportIndex={viewportIndex}
+          servicesManager={servicesManager}
+          element={element}
+        />
+      )}
+      {!disableViewportImageSliceLoadingIndicator && (
+        <ViewportImageSliceLoadingIndicator
+          viewportData={viewportData}
+          element={element}
+        />
+      )}
+      {!disableViewportOrientationMarkers && (
+        <ViewportOrientationMarkers
+          imageSliceData={imageSliceData}
+          element={element}
+          viewportData={viewportData}
+          servicesManager={servicesManager}
+          viewportIndex={viewportIndex}
+        />
+      )}
     </div>
   );
 }

extensions/cornerstone/src/Viewport/Overlays/ViewportOverlay.tsx

@@ -243,7 +243,7 @@ function _getInstanceNumberFromVolume(
   viewportIndex,
   cornerstoneViewportService
 ) {
-  const volumes = viewportData.volumes;
+  const volumes = viewportData.data.map(d => d.volume);
 
   // Todo: support fusion of acquisition plane which has instanceNumber
   if (!volumes || volumes.length > 1) {

extensions/cornerstone/src/commandsModule.ts

@@ -287,12 +287,9 @@ const commandsModule = ({ servicesManager }) => {
 
       if (viewport instanceof StackViewport) {
         viewport.resetProperties();
-        viewport.resetCamera();
-      } else {
-        // Todo: add reset properties for volume viewport
-        viewport.resetCamera();
       }
 
+      viewport.resetCamera();
       viewport.render();
     },
     scaleViewport: ({ direction }) => {
@@ -449,6 +446,11 @@ const commandsModule = ({ servicesManager }) => {
   };
 
   const definitions = {
+    getActiveViewportEnabledElement: {
+      commandFn: actions.getActiveViewportEnabledElement,
+      storeContexts: [],
+      options: {},
+    },
     setWindowLevel: {
       commandFn: actions.setWindowLevel,
       storeContexts: [],

extensions/cornerstone/src/index.tsx

@@ -18,8 +18,13 @@ import SegmentationService from './services/SegmentationService';
 import CornerstoneCacheService from './services/CornerstoneCacheService';
 
 import { toolNames } from './initCornerstoneTools';
-import { getEnabledElement, reset as enabledElementReset } from './state';
+import {
+  getEnabledElement,
+  setEnabledElement,
+  reset as enabledElementReset,
+} from './state';
 import CornerstoneViewportService from './services/ViewportService/CornerstoneViewportService';
+
 import dicomLoaderService from './utils/dicomLoaderService';
 import { registerColormap } from './utils/colormap/transferFunctionHelpers';
 
@@ -33,13 +38,14 @@ const Component = React.lazy(() => {
   );
 });
 
-const OHIFCornerstoneViewport = props => {
+const OHIFCornerstoneViewport = React.forwardRef((props, ref) => {
   return (
     <React.Suspense fallback={<div>Loading...</div>}>
-      <Component {...props} />
+      <Component ref={ref} {...props} />
     </React.Suspense>
   );
-};
+});
+OHIFCornerstoneViewport.displayName = 'OHIFCornerstoneViewport';
 
 /**
  *
@@ -90,21 +96,22 @@ const cornerstoneExtension: Types.Extensions.Extension = {
   },
   getHangingProtocolModule,
   getViewportModule({ servicesManager, commandsManager }) {
-    const ExtendedOHIFCornerstoneViewport = props => {
+    const ExtendedOHIFCornerstoneViewport = React.forwardRef((props, ref) => {
       // const onNewImageHandler = jumpData => {
       //   commandsManager.runCommand('jumpToImage', jumpData);
       // };
       const { ToolbarService } = servicesManager.services;
 
       return (
         <OHIFCornerstoneViewport
+          ref={ref}
           {...props}
           ToolbarService={ToolbarService}
           servicesManager={servicesManager}
           commandsManager={commandsManager}
         />
       );
-    };
+    });
 
     return [
       {
@@ -129,6 +136,7 @@ const cornerstoneExtension: Types.Extensions.Extension = {
             return { cornerstone, cornerstoneTools };
           },
           getEnabledElement,
+          setEnabledElement,
           dicomLoaderService,
           registerColormap,
         },

extensions/cornerstone/src/init.tsx

@@ -84,8 +84,9 @@ export default async function init({
     uiNotificationService.show({
       title: 'Cross Origin Isolation',
       message:
-        'Cross Origin Isolation is not enabled, volume rendering will not work (e.g., MPR)',
-      type: 'warning',
+        'Cross Origin Isolation is not enabled, volume rendering will be less performant',
+      type: 'info',
+      duration: 1000,
     });
   }
 
@@ -374,7 +375,7 @@ export default async function init({
 
       // check if reference lines are active
       const referenceLinesEnabled =
-        toolGroup._toolInstances['ReferenceLines'].mode ===
+        toolGroup._toolInstances?.['ReferenceLines']?.mode ===
         Enums.ToolModes.Enabled;
 
       if (!referenceLinesEnabled) {

extensions/cornerstone/src/initCornerstoneTools.js

@@ -23,6 +23,7 @@ import {
   addTool,
   annotation,
   ReferenceLinesTool,
+  TrackballRotateTool,
 } from '@cornerstonejs/tools';
 
 export default function initCornerstoneTools(configuration = {}) {
@@ -48,6 +49,7 @@ export default function initCornerstoneTools(configuration = {}) {
   addTool(CrosshairsTool);
   addTool(SegmentationDisplayTool);
   addTool(ReferenceLinesTool);
+  addTool(TrackballRotateTool);
 
   // Modify annotation tools to use dashed lines on SR
   const annotationStyle = {
@@ -86,6 +88,7 @@ const toolNames = {
   Crosshairs: CrosshairsTool.toolName,
   SegmentationDisplay: SegmentationDisplayTool.toolName,
   ReferenceLines: ReferenceLinesTool.toolName,
+  TrackballRotateTool: TrackballRotateTool.toolName,
 };
 
 export { toolNames };

extensions/cornerstone/src/initWADOImageLoader.js

@@ -53,6 +53,7 @@ export default function initWADOImageLoader(
       // Until the default is set to true (which is the case for cornerstone3D),
       // we should set this flag to false.
       convertFloatPixelDataToInt: false,
+      use16BitDataType: true,
     },
     beforeSend: function(xhr) {
       const headers = userAuthenticationService.getAuthorizationHeader();
@@ -78,6 +79,7 @@ export default function initWADOImageLoader(
     errorInterceptor: error => {
       errorHandler.getHTTPErrorHandler(error);
     },
+    withCredentials: true,
   });
 
   initWebWorkers(appConfig);

extensions/cornerstone/src/services/CornerstoneCacheService/CornerstoneCacheService.ts

@@ -1,5 +1,9 @@
 import { ServicesManager } from '@ohif/core';
 import { cache as cs3DCache, Enums, volumeLoader } from '@cornerstonejs/core';
+import { utils } from '@ohif/core';
+import sortImageIdsAndGetSpacing from './sortImageIdsAndGetSpacing';
+import makeVolumeMetadata from './makeVolumeMetadata';
+import { vec3 } from 'gl-matrix';
 
 import getCornerstoneViewportType from '../../utils/getCornerstoneViewportType';
 import {
@@ -66,7 +70,8 @@ class CornerstoneCacheService {
       );
     }
 
-    if (cs3DViewportType === Enums.ViewportType.ORTHOGRAPHIC) {
+    if (cs3DViewportType === Enums.ViewportType.ORTHOGRAPHIC 
+      || cs3DViewportType === Enums.ViewportType.VOLUME_3D) {
       viewportData = await this._getVolumeViewportData(dataSource, displaySets);
     }
 
@@ -187,8 +192,34 @@ class CornerstoneCacheService {
           dataSource
         );
 
+        const MAX_VOLUME_SIZE = 400;
+        const volumeMetadata = makeVolumeMetadata(volumeImageIds);
+        const { ImageOrientationPatient: chi } = volumeMetadata;
+        const rowCosineVec = vec3.fromValues(chi[0], chi[1], chi[2]);
+        const colCosineVec = vec3.fromValues(chi[3], chi[4], chi[5]);
+        const scanAxisNormal = vec3.create();
+        vec3.cross(scanAxisNormal, rowCosineVec, colCosineVec);
+        const { sortedImageIds } = sortImageIdsAndGetSpacing(
+          volumeImageIds,
+          scanAxisNormal
+        );
+
+        const distributedCopy = (items, n) => {
+          const elements = [items[0]];
+          const totalItems = items.length - 2;
+          const interval = totalItems / (n - 2);
+          for (let i = 1; i < n - 1; i++) {
+            elements.push(items[Math.floor(i * interval)]);
+          }
+          elements.push(items[items.length - 1]);
+          return elements;
+        };
+
         volume = await volumeLoader.createAndCacheVolume(volumeId, {
-          imageIds: volumeImageIds,
+          imageIds:
+            volumeImageIds.length > MAX_VOLUME_SIZE
+              ? distributedCopy(sortedImageIds, MAX_VOLUME_SIZE)
+              : volumeImageIds,
         });
 
         this.volumeImageIds.set(

extensions/cornerstone/src/services/CornerstoneCacheService/makeVolumeMetadata.ts

@@ -0,0 +1,89 @@
+import { metaData } from '@cornerstonejs/core';
+import type { Types } from '@cornerstonejs/core';
+
+/**
+ * It creates a metadata object for a volume given the imageIds that compose it.
+ * It uses the first imageId to get the metadata.
+ *
+ * @param imageIds - array of imageIds
+ * @returns The volume metadata
+ */
+export default function makeVolumeMetadata(
+  imageIds: Array<string>
+): Types.Metadata {
+  const imageId0 = imageIds[0];
+
+  const {
+    pixelRepresentation,
+    bitsAllocated,
+    bitsStored,
+    highBit,
+    photometricInterpretation,
+    samplesPerPixel,
+  } = metaData.get('imagePixelModule', imageId0);
+
+  // Add list of VOIs stored on the DICOM.
+  const voiLut = [];
+
+  const voiLutModule = metaData.get('voiLutModule', imageId0);
+
+  // voiLutModule is not always present
+  let voiLUTFunction;
+  if (voiLutModule) {
+    const { windowWidth, windowCenter } = voiLutModule;
+    voiLUTFunction = voiLutModule?.voiLUTFunction;
+
+    if (Array.isArray(windowWidth)) {
+      for (let i = 0; i < windowWidth.length; i++) {
+        voiLut.push({
+          windowWidth: windowWidth[i],
+          windowCenter: windowCenter[i],
+        });
+      }
+    } else {
+      voiLut.push({
+        windowWidth: windowWidth,
+        windowCenter: windowCenter,
+      });
+    }
+  } else {
+    voiLut.push({
+      windowWidth: undefined,
+      windowCenter: undefined,
+    });
+  }
+
+  const { modality, seriesInstanceUID } = metaData.get(
+    'generalSeriesModule',
+    imageId0
+  );
+
+  const {
+    imageOrientationPatient,
+    pixelSpacing,
+    frameOfReferenceUID,
+    columns,
+    rows,
+  } = metaData.get('imagePlaneModule', imageId0);
+
+  // Map to dcmjs-style keywords. This is becoming the standard and makes it
+  // Easier to swap out cornerstoneWADOImageLoader at a later date.
+  return {
+    BitsAllocated: bitsAllocated,
+    BitsStored: bitsStored,
+    SamplesPerPixel: samplesPerPixel,
+    HighBit: highBit,
+    PhotometricInterpretation: photometricInterpretation,
+    PixelRepresentation: pixelRepresentation,
+    Modality: modality,
+    ImageOrientationPatient: imageOrientationPatient,
+    PixelSpacing: pixelSpacing,
+    FrameOfReferenceUID: frameOfReferenceUID,
+    Columns: columns,
+    Rows: rows,
+    // This is a reshaped object and not a dicom tag:
+    voiLut,
+    VOILUTFunction: voiLUTFunction,
+    SeriesInstanceUID: seriesInstanceUID,
+  };
+}