feat: add segment label tool (#5164)

This commit is contained in:
Pedro Köhler authored and GitHub committed 2025-07-09 14:11:54 -04:00
1 parent d19cd6ec7b
commit ac852485cd
15 files changed
+351 -340

No files matched your search

@@ -46,8 +46,8 @@
},
"dependencies": {
"@babel/runtime": "^7.20.13",
"@cornerstonejs/adapters": "^3.24.0",
"@cornerstonejs/core": "^3.24.0",
"@cornerstonejs/adapters": "^3.28.2",
"@cornerstonejs/core": "^3.28.2",
"@kitware/vtk.js": "32.12.0",
"react-color": "^2.19.3"
}
@@ -46,8 +46,8 @@
},
"dependencies": {
"@babel/runtime": "^7.20.13",
"@cornerstonejs/adapters": "^3.24.0",
"@cornerstonejs/core": "^3.24.0",
"@cornerstonejs/adapters": "^3.28.2",
"@cornerstonejs/core": "^3.28.2",
"@kitware/vtk.js": "32.12.0",
"react-color": "^2.19.3"
}
+3 -3
View File
@@ -46,9 +46,9 @@
},
"dependencies": {
"@babel/runtime": "^7.20.13",
"@cornerstonejs/adapters": "^3.24.0",
"@cornerstonejs/core": "^3.24.0",
"@cornerstonejs/tools": "^3.24.0",
"@cornerstonejs/adapters": "^3.28.2",
"@cornerstonejs/core": "^3.28.2",
"@cornerstonejs/tools": "^3.28.2",
"classnames": "^2.3.2"
}
}
@@ -42,8 +42,8 @@
},
"dependencies": {
"@babel/runtime": "^7.20.13",
"@cornerstonejs/core": "^3.24.0",
"@cornerstonejs/tools": "^3.24.0",
"@cornerstonejs/core": "^3.28.2",
"@cornerstonejs/tools": "^3.28.2",
"classnames": "^2.3.2"
}
}
+7 -7
View File
@@ -38,7 +38,7 @@
"@cornerstonejs/codec-libjpeg-turbo-8bit": "^1.2.2",
"@cornerstonejs/codec-openjpeg": "^1.2.4",
"@cornerstonejs/codec-openjph": "^2.4.5",
"@cornerstonejs/dicom-image-loader": "^3.24.0",
"@cornerstonejs/dicom-image-loader": "^3.28.2",
"@ohif/core": "3.11.0-beta.74",
"@ohif/ui": "3.11.0-beta.74",
"dcmjs": "^0.42.0",
@@ -51,12 +51,12 @@
},
"dependencies": {
"@babel/runtime": "^7.20.13",
"@cornerstonejs/adapters": "^3.24.0",
"@cornerstonejs/ai": "^3.24.0",
"@cornerstonejs/core": "^3.24.0",
"@cornerstonejs/labelmap-interpolation": "^3.24.0",
"@cornerstonejs/polymorphic-segmentation": "^3.24.0",
"@cornerstonejs/tools": "^3.24.0",
"@cornerstonejs/adapters": "^3.28.2",
"@cornerstonejs/ai": "^3.28.2",
"@cornerstonejs/core": "^3.28.2",
"@cornerstonejs/labelmap-interpolation": "^3.28.2",
"@cornerstonejs/polymorphic-segmentation": "^3.28.2",
"@cornerstonejs/tools": "^3.28.2",
"@itk-wasm/morphological-contour-interpolation": "1.1.0",
"@kitware/vtk.js": "32.12.0",
"html2canvas": "^1.4.1",
@@ -1728,6 +1728,17 @@ function commandsModule({
}
});
},
toggleSegmentLabel: ({ toggle }) => {
const toolGroupIds = toolGroupService.getToolGroupIds();
toolGroupIds.forEach(toolGroupId => {
const toolGroup = cornerstoneTools.ToolGroupManager.getToolGroup(toolGroupId);
if (toggle) {
toolGroup.setToolActive(cornerstoneTools.SegmentLabelTool.toolName);
} else {
toolGroup.setToolDisabled(cornerstoneTools.SegmentLabelTool.toolName);
}
});
},
toggleUseCenterSegmentIndex: ({ toggle }) => {
let labelmapTools = getLabelmapTools({ toolGroupService });
labelmapTools = labelmapTools.filter(tool => !tool.toolName.includes('Eraser'));
@@ -2331,6 +2342,7 @@ function commandsModule({
hydrateSecondaryDisplaySet: actions.hydrateSecondaryDisplaySet,
getVolumeIdForDisplaySet: actions.getVolumeIdForDisplaySet,
triggerCreateAnnotationMemo: actions.triggerCreateAnnotationMemo,
toggleSegmentLabel: actions.toggleSegmentLabel,
};
return {
@@ -38,6 +38,7 @@ export default function getSegmentationPanelCustomization({ commandsManager, ser
const [previewEdits, setPreviewEdits] = useState(false);
const [toggleSegmentEnabled, setToggleSegmentEnabled] = useState(false);
const [useCenterAsSegmentIndex, setUseCenterAsSegmentIndex] = useState(false);
const [shouldShowLabelOnHover, setShouldShowLabelOnHover] = useState(false);
const handlePreviewEditsChange = checked => {
setPreviewEdits(checked);
commandsManager.run('toggleSegmentPreviewEdit', { toggle: checked });
@@ -53,6 +54,11 @@ export default function getSegmentationPanelCustomization({ commandsManager, ser
commandsManager.run('toggleUseCenterSegmentIndex', { toggle: checked });
};
const handleToggleShowLabelOnHover = checked => {
setShouldShowLabelOnHover(checked);
commandsManager.run('toggleSegmentLabel', { toggle: checked });
};
return (
<div className="bg-muted flex flex-col gap-4 border-b border-b-[2px] border-black px-2 py-3">
<div className="flex items-center gap-2">
@@ -78,6 +84,14 @@ export default function getSegmentationPanelCustomization({ commandsManager, ser
/>
<span className="text-base text-white">Hover on segment border to activate</span>
</div>
<div className="flex items-center gap-2">
<Switch
checked={shouldShowLabelOnHover}
onCheckedChange={handleToggleShowLabelOnHover}
/>
<span className="text-base text-white">Show segment label on mouse hover</span>
</div>
</div>
);
},
@@ -40,6 +40,7 @@ import {
WindowLevelRegionTool,
SegmentSelectTool,
RegionSegmentPlusTool,
SegmentLabelTool,
} from '@cornerstonejs/tools';
import { LabelmapSlicePropagationTool, MarkerLabelmapTool } from '@cornerstonejs/ai';
import * as polySeg from '@cornerstonejs/polymorphic-segmentation';
@@ -104,6 +105,7 @@ export default function initCornerstoneTools(configuration = {}) {
addTool(WindowLevelRegionTool);
addTool(PlanarFreehandContourSegmentationTool);
addTool(SegmentSelectTool);
addTool(SegmentLabelTool);
addTool(LabelmapSlicePropagationTool);
addTool(MarkerLabelmapTool);
addTool(RegionSegmentPlusTool);
@@ -162,6 +164,7 @@ const toolNames = {
PlanarFreehandContourSegmentation: PlanarFreehandContourSegmentationTool.toolName,
SegmentBidirectional: SegmentBidirectionalTool.toolName,
SegmentSelect: SegmentSelectTool.toolName,
SegmentLabel: SegmentLabelTool.toolName,
LabelmapSlicePropagation: LabelmapSlicePropagationTool.toolName,
MarkerLabelmap: MarkerLabelmapTool.toolName,
RegionSegmentPlus: RegionSegmentPlusTool.toolName,
+2 -2
View File
@@ -32,8 +32,8 @@
"start": "yarn run dev"
},
"peerDependencies": {
"@cornerstonejs/core": "^3.24.0",
"@cornerstonejs/tools": "^3.24.0",
"@cornerstonejs/core": "^3.28.2",
"@cornerstonejs/tools": "^3.28.2",
"@ohif/core": "3.11.0-beta.74",
"@ohif/extension-cornerstone-dicom-sr": "3.11.0-beta.74",
"@ohif/extension-default": "3.11.0-beta.74",