fix(colormap): update opacityMapping to opacity and use simple list r…

…enderer(#3464) Co-authored-by: Alireza <[email protected]>
OHIF · Jul 4, 2023 · 64f8bb5 · 64f8bb5
1 parent ce29bbe
commit 64f8bb5
Show file tree

Hide file tree

Showing 14 changed files with 96 additions and 83 deletions.
diff --git a/extensions/cornerstone-dicom-sr/package.json b/extensions/cornerstone-dicom-sr/package.json
@@ -44,9 +44,9 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.20.13",
-    "@cornerstonejs/adapters": "^1.2.4",
-    "@cornerstonejs/core": "^1.2.4",
-    "@cornerstonejs/tools": "^1.2.4",
+    "@cornerstonejs/adapters": "^1.2.8",
+    "@cornerstonejs/core": "^1.2.8",
+    "@cornerstonejs/tools": "^1.2.8",
     "classnames": "^2.3.2"
   }
 }
diff --git a/extensions/cornerstone/package.json b/extensions/cornerstone/package.json
@@ -36,7 +36,7 @@
     "@cornerstonejs/codec-libjpeg-turbo-8bit": "^1.2.2",
     "@cornerstonejs/codec-openjpeg": "^1.2.2",
     "@cornerstonejs/codec-openjph": "^2.4.2",
-    "@cornerstonejs/dicom-image-loader": "^1.2.4",
+    "@cornerstonejs/dicom-image-loader": "^1.2.8",
     "@ohif/core": "3.7.0-beta.21",
     "@ohif/ui": "3.7.0-beta.21",
     "dcmjs": "^0.29.6",
@@ -52,10 +52,10 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.20.13",
-    "@cornerstonejs/adapters": "^1.2.4",
-    "@cornerstonejs/core": "^1.2.4",
-    "@cornerstonejs/streaming-image-volume-loader": "^1.2.4",
-    "@cornerstonejs/tools": "^1.2.4",
+    "@cornerstonejs/adapters": "^1.2.8",
+    "@cornerstonejs/core": "^1.2.8",
+    "@cornerstonejs/streaming-image-volume-loader": "^1.2.8",
+    "@cornerstonejs/tools": "^1.2.8",
     "@kitware/vtk.js": "27.3.1",
     "html2canvas": "^1.4.1",
     "lodash.debounce": "4.0.8",

diff --git a/extensions/cornerstone/src/index.tsx b/extensions/cornerstone/src/index.tsx
@@ -24,7 +24,6 @@ import { toolNames } from './initCornerstoneTools';
 import { getEnabledElement, reset as enabledElementReset } from './state';
 import dicomLoaderService from './utils/dicomLoaderService';
 import getActiveViewportEnabledElement from './utils/getActiveViewportEnabledElement';
-import { registerColormap } from './utils/colormap/transferFunctionHelpers';
 
 import { id } from './id';
 import * as csWADOImageLoader from './initWADOImageLoader.js';

diff --git a/extensions/default/src/Toolbar/Toolbar.tsx b/extensions/default/src/Toolbar/Toolbar.tsx
@@ -29,7 +29,7 @@ export default function Toolbar({ servicesManager }) {
 
   return (
     <>
-      {toolbarButtons.map((toolDef, index) => {
+      {toolbarButtons.map(toolDef => {
         const { id, Component, componentProps } = toolDef;
         // TODO: ...
 

diff --git a/extensions/measurement-tracking/package.json b/extensions/measurement-tracking/package.json
@@ -30,8 +30,8 @@
     "start": "yarn run dev"
   },
   "peerDependencies": {
-    "@cornerstonejs/core": "^1.2.4",
-    "@cornerstonejs/tools": "^1.2.4",
+    "@cornerstonejs/core": "^1.2.8",
+    "@cornerstonejs/tools": "^1.2.8",
     "@ohif/core": "3.7.0-beta.21",
     "@ohif/extension-cornerstone-dicom-sr": "3.7.0-beta.21",
     "@ohif/ui": "3.7.0-beta.21",

diff --git a/extensions/tmtv/src/commandsModule.js b/extensions/tmtv/src/commandsModule.js
@@ -553,7 +553,16 @@ const commandsModule = ({
         commandsManager.runCommand('setViewportColormap', {
           viewportIndex,
           displaySetInstanceUID: ptDisplaySet.displaySetInstanceUID,
-          colormap,
+          colormap: {
+            name: colormap,
+            // TODO: This opacity mapping matches that in hpViewports, but
+            // ideally making this editable in a side panel would be useful
+            opacity: [
+              { value: 0, opacity: 0 },
+              { value: 0.1, opacity: 0.9 },
+              { value: 1, opacity: 0.95 },
+            ],
+          },
         });
 
         viewports.push(

diff --git a/extensions/tmtv/src/utils/hpViewports.ts b/extensions/tmtv/src/utils/hpViewports.ts
@@ -254,16 +254,20 @@ const fusionAXIAL = {
       id: 'ctDisplaySet',
     },
     {
+      id: 'ptDisplaySet',
       options: {
         colormap: {
           name: 'hsv',
-          opacityMapping: [{ value: 0.1, opacity: 0.9 }],
+          opacity: [
+            { value: 0, opacity: 0 },
+            { value: 0.1, opacity: 0.9 },
+            { value: 1, opacity: 0.95 },
+          ],
         },
         voi: {
           custom: 'getPTVOIRange',
         },
       },
-      id: 'ptDisplaySet',
     },
   ],
 };
@@ -310,16 +314,20 @@ const fusionSAGITTAL = {
       id: 'ctDisplaySet',
     },
     {
+      id: 'ptDisplaySet',
       options: {
         colormap: {
           name: 'hsv',
-          opacityMapping: [{ value: 0.1, opacity: 0.9 }],
+          opacity: [
+            { value: 0, opacity: 0 },
+            { value: 0.1, opacity: 0.9 },
+            { value: 1, opacity: 0.95 },
+          ],
         },
         voi: {
           custom: 'getPTVOIRange',
         },
       },
-      id: 'ptDisplaySet',
     },
   ],
 };
@@ -366,16 +374,20 @@ const fusionCORONAL = {
       id: 'ctDisplaySet',
     },
     {
+      id: 'ptDisplaySet',
       options: {
         colormap: {
           name: 'hsv',
-          opacityMapping: [{ value: 0.1, opacity: 0.9 }],
+          opacity: [
+            { value: 0, opacity: 0 },
+            { value: 0.1, opacity: 0.9 },
+            { value: 1, opacity: 0.95 },
+          ],
         },
         voi: {
           custom: 'getPTVOIRange',
         },
       },
-      id: 'ptDisplaySet',
     },
   ],
 };

diff --git a/modes/tmtv/src/toolbarButtons.js b/modes/tmtv/src/toolbarButtons.js
@@ -24,9 +24,8 @@ function _createButton(type, id, icon, label, commands, tooltip) {
 
 function _createColormap(label, colormap) {
   return {
-    id: label.toString(),
-    title: label,
-    subtitle: label,
+    id: label,
+    label,
     type: 'action',
     commands: [
       {
@@ -36,13 +35,6 @@ function _createColormap(label, colormap) {
           colormap,
         },
       },
-      {
-        commandName: 'setFusionPTColormap',
-        commandOptions: {
-          toolGroupId: toolGroupIds.Fusion,
-          colormap,
-        },
-      },
     ],
   };
 }
@@ -313,7 +305,8 @@ const toolbarButtons = [
           commandName: 'displayNotification',
           commandOptions: {
             title: 'RectangleROI Threshold Tip',
-            text: 'RectangleROI Threshold tool should be used on PT Axial Viewport',
+            text:
+              'RectangleROI Threshold tool should be used on PT Axial Viewport',
             type: 'info',
           },
         },
@@ -345,7 +338,6 @@ const toolbarButtons = [
         tooltip: 'PET Image Colormap',
       },
       isAction: true, // ?
-      renderer: WindowLevelMenuItem,
       items: [
         _createColormap('HSV', 'hsv'),
         _createColormap('Hot Iron', 'hot_iron'),

diff --git a/package.json b/package.json
@@ -149,7 +149,7 @@
     ]
   },
   "resolutions": {
-    "@cornerstonejs/core": "^1.2.4",
+    "@cornerstonejs/core": "^1.2.8",
     "**/@babel/runtime": "^7.20.13",
     "commander": "8.3.0",
     "nth-check": "^2.1.1",

diff --git a/platform/app/package.json b/platform/app/package.json
@@ -51,7 +51,7 @@
     "@cornerstonejs/codec-libjpeg-turbo-8bit": "^1.2.2",
     "@cornerstonejs/codec-openjpeg": "^1.2.2",
     "@cornerstonejs/codec-openjph": "^2.4.2",
-    "@cornerstonejs/dicom-image-loader": "^1.2.4",
+    "@cornerstonejs/dicom-image-loader": "^1.2.8",
     "@ohif/core": "3.7.0-beta.21",
     "@ohif/extension-cornerstone": "3.7.0-beta.21",
     "@ohif/extension-cornerstone-dicom-rt": "3.7.0-beta.21",

diff --git a/platform/core/package.json b/platform/core/package.json
@@ -35,7 +35,7 @@
     "@cornerstonejs/codec-libjpeg-turbo-8bit": "^1.2.2",
     "@cornerstonejs/codec-openjpeg": "^1.2.2",
     "@cornerstonejs/codec-openjph": "^2.4.2",
-    "@cornerstonejs/dicom-image-loader": "^1.2.4",
+    "@cornerstonejs/dicom-image-loader": "^1.2.8",
     "@ohif/ui": "3.7.0-beta.21",
     "cornerstone-math": "0.1.9",
     "dicom-parser": "^1.8.21"

diff --git a/platform/core/src/defaults/hotkeyBindings.js b/platform/core/src/defaults/hotkeyBindings.js
@@ -173,30 +173,31 @@ const bindings = [
     label: 'W/L Preset 5',
     keys: ['5'],
   },
-  {
-    commandName: 'setWindowLevel',
-    commandOptions: windowLevelPresets[6],
-    label: 'W/L Preset 6',
-    keys: ['6'],
-  },
-  {
-    commandName: 'setWindowLevel',
-    commandOptions: windowLevelPresets[7],
-    label: 'W/L Preset 7',
-    keys: ['7'],
-  },
-  {
-    commandName: 'setWindowLevel',
-    commandOptions: windowLevelPresets[8],
-    label: 'W/L Preset 8',
-    keys: ['8'],
-  },
-  {
-    commandName: 'setWindowLevel',
-    commandOptions: windowLevelPresets[9],
-    label: 'W/L Preset 9',
-    keys: ['9'],
-  },
+  // These don't exist, so don't try applying them....
+  // {
+  //   commandName: 'setWindowLevel',
+  //   commandOptions: windowLevelPresets[6],
+  //   label: 'W/L Preset 6',
+  //   keys: ['6'],
+  // },
+  // {
+  //   commandName: 'setWindowLevel',
+  //   commandOptions: windowLevelPresets[7],
+  //   label: 'W/L Preset 7',
+  //   keys: ['7'],
+  // },
+  // {
+  //   commandName: 'setWindowLevel',
+  //   commandOptions: windowLevelPresets[8],
+  //   label: 'W/L Preset 8',
+  //   keys: ['8'],
+  // },
+  // {
+  //   commandName: 'setWindowLevel',
+  //   commandOptions: windowLevelPresets[9],
+  //   label: 'W/L Preset 9',
+  //   keys: ['9'],
+  // },
 ];
 
 export default bindings;
diff --git a/platform/docs/docs/platform/extensions/modules/hpModule.md b/platform/docs/docs/platform/extensions/modules/hpModule.md
@@ -246,7 +246,7 @@ A list of criteria for the protocol along with the provided points for ranking.
 
   - `constraint`: the constraint that needs to be satisfied for the attribute. It accepts a `validator` which can be
     [`equals`, `doesNotEqual`, `contains`, `doesNotContain`, `startsWith`, `endsWidth`]
-   
+
   - | Rule 	| Single Value 	| Array Value 	| Example 	                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      |
     |---	|---	|---	|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
     | equals 	| === 	| All members are === in same order 	| value = ['abc', 'def', 'GHI']<br/>testValue = 'abc' (Fail)<br/><br/>          = ['abc'] (Fail)<br/><br/>          = ['abc', 'def', 'GHI'] (Valid)<br/><br/>          = ['abc', 'GHI', 'def'] (Fail)<br/><br/>          = ['abc', 'def'] (Fail)<br/><br/>value = 'Attenuation Corrected'<br/>testValue = 'Attenuation Corrected' (Valid)<br/>          = 'Attenuation' (Fail)<br/><br/> 	       value = ['Attenuation Corrected'] <br/>     testValue = ['Attenuation Corrected'] (Valid)<br/> = 'Attenuation Corrected' (Valid) <br/>  = 'Attenuation' (Fail) <br/>                                                            |
@@ -439,7 +439,7 @@ As you can see in the hanging protocol we defined three viewports (but only show
    - `options` (optional): options for the display set
         - voi: windowing options for the display set (optional: windowWidth, windowCenter)
         - voiInverted: whether the VOI is inverted or not (optional)
-        - colormap: colormap for the display set (optional, it is an object with `{ name }` and optional extra `opacityMapping` property)
+        - colormap: colormap for the display set (optional, it is an object with `{ name }` and optional extra `opacity` property)
         - displayPreset: display preset for the display set (optional, used for 3D volume rendering. e.g., 'CT-Bone')
 
 

diff --git a/yarn.lock b/yarn.lock
@@ -1589,10 +1589,10 @@
   resolved "https://registry.yarnpkg.com/@colors/colors/-/colors-1.5.0.tgz#bb504579c1cae923e6576a4f5da43d25f97bdbd9"
   integrity sha512-ooWCrlZP11i8GImSjTHYHLkvFDP48nS4+204nGb1RiX/WXYHmJA2III9/e2DWVabCESdW7hBAEzHRqUn9OUVvQ==
 
-"@cornerstonejs/adapters@^1.2.4":
-  version "1.2.4"
-  resolved "https://registry.npmjs.org/@cornerstonejs/adapters/-/adapters-1.2.4.tgz#9920ca4cae2acf064ba3165cde6da67123fbc25e"
-  integrity sha512-d2wl49d45QdjM9F5ATkO1g8/PoTqTSehk7wYdgEfFXmXbl8FVfaat/PAMDiyRZ65CBctmWcGcgyoFS14U9KvHQ==
+"@cornerstonejs/adapters@^1.2.8":
+  version "1.2.8"
+  resolved "https://registry.yarnpkg.com/@cornerstonejs/adapters/-/adapters-1.2.8.tgz#26e584971b917dd099a73511abde32f236655915"
+  integrity sha512-W1PD+XJ69nUEM5D1wZMyJxRNsKTxWSwtJ6gZ1LH19f7uLSIt1OdKq3PoUZ0KyUiDeP585+NPChquGO14vn8eQA==
   dependencies:
     "@babel/runtime-corejs2" "^7.17.8"
     dcmjs "^0.29.5"
@@ -1640,43 +1640,43 @@
   resolved "https://registry.yarnpkg.com/@cornerstonejs/codec-openjph/-/codec-openjph-2.4.2.tgz#e96721d56f6ec96f7f95c16321d88cc8467d8d81"
   integrity sha512-lgdvBvvNezleY+4pIe2ceUsJzlZe/0PipdeubQ3vZZOz3xxtHHMR1XFCl4fgd8gosR8COHuD7h6q+MwgrwBsng==
 
-"@cornerstonejs/core@^1.2.4":
-  version "1.2.4"
-  resolved "https://registry.npmjs.org/@cornerstonejs/core/-/core-1.2.4.tgz#98c480f0db3cc98477f1160b47e8c686357e794b"
-  integrity sha512-CRrpn744m8e6damEdJaE6spF1C7/qS/h2OZiaHQnobDkJHdnSU8JHcPeP4NuMI0eRjk8NL/nGadVF4YXDOSppg==
+"@cornerstonejs/core@^1.2.8":
+  version "1.2.8"
+  resolved "https://registry.yarnpkg.com/@cornerstonejs/core/-/core-1.2.8.tgz#e84ecf74cba66085f342a03965f3d73111bb4948"
+  integrity sha512-7RPIxXiMt9Ud5PWZ3+fVYJRhCzObbb4emaQvQ3dPo30xLyU7EcNDEyLjIezJfJHAMOHKQo9SnsoUQz+8YmdXSQ==
   dependencies:
     "@kitware/vtk.js" "27.3.1"
     detect-gpu "^5.0.22"
     gl-matrix "^3.4.3"
     lodash.clonedeep "4.5.0"
 
-"@cornerstonejs/dicom-image-loader@^1.2.4":
-  version "1.2.4"
-  resolved "https://registry.npmjs.org/@cornerstonejs/dicom-image-loader/-/dicom-image-loader-1.2.4.tgz#d917768788d222918c0c5e7e29d7968922fbaf5c"
-  integrity sha512-b1FHjqc+j4QaWUtEw8JeQGmTsejYfbDwdIBP5GKh7EuHjrURA0N+JThau2fYHL7oNjYmDvNx9OW9A4dYswI0mg==
+"@cornerstonejs/dicom-image-loader@^1.2.8":
+  version "1.2.8"
+  resolved "https://registry.yarnpkg.com/@cornerstonejs/dicom-image-loader/-/dicom-image-loader-1.2.8.tgz#61cd310310f1cd8d0837135240928e18f5d63c0f"
+  integrity sha512-w/JrforcHUvVPXEmxT015cGb/IT+py2rTKXk5udqyX/dLoI1q8FaqHFq8z/pN+9AXsUrdQ2d7gmXTpDihS8b4Q==
   dependencies:
     "@cornerstonejs/codec-charls" "^1.2.3"
     "@cornerstonejs/codec-libjpeg-turbo-8bit" "^1.2.2"
     "@cornerstonejs/codec-openjpeg" "^1.2.2"
     "@cornerstonejs/codec-openjph" "^2.4.2"
-    "@cornerstonejs/core" "^1.2.4"
+    "@cornerstonejs/core" "^1.2.8"
     dicom-parser "^1.8.9"
     pako "^2.0.4"
     uuid "^9.0.0"
 
-"@cornerstonejs/streaming-image-volume-loader@^1.2.4":
-  version "1.2.4"
-  resolved "https://registry.npmjs.org/@cornerstonejs/streaming-image-volume-loader/-/streaming-image-volume-loader-1.2.4.tgz#cf5c55a44cb736b220b2a7e02a4e3ffc6fc09353"
-  integrity sha512-MfMz6rvI+Buhd+6OSJRqGHO/8Ol2HSAcSjltXaJ0Sc5YQ6tnzNEYGqnADY/E8mLCFIj/d2l6sT3Uy76USn+ODQ==
+"@cornerstonejs/streaming-image-volume-loader@^1.2.8":
+  version "1.2.8"
+  resolved "https://registry.yarnpkg.com/@cornerstonejs/streaming-image-volume-loader/-/streaming-image-volume-loader-1.2.8.tgz#fcbc6de46c45968e7806f8e322f0605cac4a4b85"
+  integrity sha512-/FWbWglSNIKgV0ZUDQrkCQkg+Dzf85ReH+svqg8sBhCiCKSdKSAQXEaDG471O+nmVdNg7VW8DE8PwA/yVe/3yA==
   dependencies:
-    "@cornerstonejs/core" "^1.2.4"
+    "@cornerstonejs/core" "^1.2.8"
 
-"@cornerstonejs/tools@^1.2.4":
-  version "1.2.4"
-  resolved "https://registry.npmjs.org/@cornerstonejs/tools/-/tools-1.2.4.tgz#292cc0782158811ab623ee96fb2ba9d7e2fd22e6"
-  integrity sha512-EM2wf1unzMZ5RPj5hCZP5SDarOO8P1uK9ORZ3aEKL0q+d0xdirKTzazp38cC+Deavda460Q9KmaHCPTtSHfE1g==
+"@cornerstonejs/tools@^1.2.8":
+  version "1.2.8"
+  resolved "https://registry.yarnpkg.com/@cornerstonejs/tools/-/tools-1.2.8.tgz#8979a40cf53a4a2a648ef8c0fc24ef15603a0f9a"
+  integrity sha512-E3+UOgl/DRNvvxTJziMoEa6uudKSGr/JFL5k9HvjU2HtGm4kdpYNo9lGnsTqeuUZ2xrPnUZFLYHVwF1WVegoEw==
   dependencies:
-    "@cornerstonejs/core" "^1.2.4"
+    "@cornerstonejs/core" "^1.2.8"
     lodash.clonedeep "4.5.0"
     lodash.get "^4.4.2"