feat: Add initial segmentation demo

packages/cornerstone-render/src/RenderingEngine/Scene.ts

@@ -1,10 +1,13 @@
+import { vtkImageData } from 'vtk.js/Sources/Common/DataModel/ImageData'
 import renderingEngineCache from './renderingEngineCache'
 import RenderingEngine from './RenderingEngine'
 import { createVolumeActor } from './helpers'
 import { loadVolume } from '../volumeLoader'
 import { uuidv4 } from '../utilities'
 import VolumeViewport from './VolumeViewport'
 import { VolumeActor, ActorEntry } from '../types'
+import vtkVolumeMapper from 'vtk.js/Sources/Rendering/Core/VolumeMapper'
+import vtkVolume from 'vtk.js/Sources/Rendering/Core/Volume'
 
 type VolumeInput = {
   volumeUID: string
@@ -158,6 +161,45 @@ class Scene {
     }
   }
 
+  // todo: should add segmentationUID similar to volumeUID
+  public async setSegmentations(
+    labelMap: any,
+    immediate = false
+  ): Promise<void> {
+    debugger
+    const volumeActors = []
+
+    // todo: use shared volume mapper for seg too
+    const { imageData: vtkImageData, actor, mapper } = labelMap
+    // const volumeMapper = vtkVolumeMapper.newInstance()
+    // volumeMapper.setInputData(vtkImageData)
+
+    // const spacing = vtkImageData.getSpacing()
+    // // Set the sample distance to half the mean length of one side. This is where the divide by 6 comes from.
+    // // https://github.com/Kitware/VTK/blob/6b559c65bb90614fb02eb6d1b9e3f0fca3fe4b0b/Rendering/VolumeOpenGL2/vtkSmartVolumeMapper.cxx#L344
+    // const sampleDistance = (spacing[0] + spacing[1] + spacing[2]) / 6
+
+    // // This is to allow for good pixel level image quality.
+    // volumeMapper.setMaximumSamplesPerRay(4000)
+
+    // volumeMapper.setSampleDistance(sampleDistance)
+
+    // const volumeActor = vtkVolume.newInstance()
+    // // volumeActor.getProperty().setInterpolationTypeToNearest()
+    // volumeActor.setMapper(volumeMapper)
+
+    volumeActors.push({ uid: 'Seg', volumeActor: actor })
+
+    this._sceneViewports.forEach((uid) => {
+      const viewport = this.getViewport(uid)
+      viewport.addActors(volumeActors)
+    })
+
+    if (immediate) {
+      this.render()
+    }
+  }
+
   /**
    * @method render Renders all `Viewport`s in the `Scene` using the `Scene`'s `RenderingEngine`.
    */

packages/cornerstone-render/src/RenderingEngine/helpers/index.js

@@ -1,3 +1,4 @@
 import createVolumeActor from './createVolumeActor'
+import createVolumeMapper from './createVolumeMapper'
 
-export { createVolumeActor }
+export { createVolumeActor, createVolumeMapper }

packages/cornerstone-render/src/RenderingEngine/index.ts

@@ -1,6 +1,12 @@
 import RenderingEngine from './RenderingEngine'
 import getRenderingEngine from './getRenderingEngine'
+import { createVolumeActor, createVolumeMapper } from './helpers'
 
-export { getRenderingEngine, RenderingEngine }
+export {
+  getRenderingEngine,
+  RenderingEngine,
+  createVolumeActor,
+  createVolumeMapper,
+}
 
 export default RenderingEngine

packages/cornerstone-render/src/index.ts

@@ -5,6 +5,7 @@ import ORIENTATION from './constants/orientation'
 import VIEWPORT_TYPE from './constants/viewportType'
 import INTERPOLATION_TYPE from './constants/interpolationType'
 //
+import { createVolumeActor, createVolumeMapper } from './RenderingEngine'
 import RenderingEngine from './RenderingEngine'
 import VolumeViewport from './RenderingEngine/VolumeViewport'
 import StackViewport from './RenderingEngine/StackViewport'
@@ -81,6 +82,8 @@ export {
   RenderingEngine,
   getRenderingEngine,
   getRenderingEngines,
+  createVolumeActor,
+  createVolumeMapper,
   //
   cache,
   Cache,

packages/demo/src/App.tsx

@@ -20,6 +20,7 @@ import TestUtils from './ExampleTestUtils'
 import TestUtilsVolume from './ExampleTestUtilsVolume'
 import CalibrationExample from './ExampleCalibration'
 import { resetCPURenderingOnlyForDebugOrTests } from '@ohif/cornerstone-render'
+import SegmentationRender from './ExampleSegmentationRender'
 
 function LinkOut({ href, text }) {
   return (
@@ -77,6 +78,11 @@ function Index() {
       url: '/oneStackCPU',
       text: 'Example one Stack with CPU fallback (even if your environment supports GPU)',
     },
+    {
+      title: 'Segmentation Render',
+      url: '/segmentationRender',
+      text: 'Example for demonstrating the rendering of Segmentation',
+    },
     {
       title: 'Canvas Resize',
       url: '/canvasResize',
@@ -231,6 +237,11 @@ function AppRouter() {
       children: <CalibrationExample />,
     })
 
+  const segmentationRender = () =>
+    Example({
+      children: <SegmentationRender />,
+    })
+
   const stackViewport = () =>
     Example({
       children: <StackViewportExample />,
@@ -323,6 +334,7 @@ function AppRouter() {
         <Route exact path="/testUtils/" render={Test} />
         <Route exact path="/testUtilsVolume/" render={TestVolume} />
         <Route exact path="/calibratedImages/" render={calibratedImages} />
+        <Route exact path="/segmentationRender/" render={segmentationRender} />
         <Route
           exact
           path="/toolDisplayConfiguration/"