OHIF Viewer 分割Segmentation面板自定义指南从配置项到源码实现的完整解析【免费下载链接】ViewersOHIF zero-footprint DICOM viewer and oncology specific Lesion Tracker, plus shared extension packages项目地址: https://gitcode.com/GitHub_Trending/vi/ViewersOHIF Viewer 的分割面板Segmentation Panel承担着医学影像分割结果的组织、统计与交互操作功能。本文以version-3.11文档中 Segmentation Customization 为骨架系统讲解panelSegmentation.*系列自定义项的默认值、配置语法与实战示例并结合 segmentationPanelCustomization.tsx 与 PanelSegmentation.tsx 源码揭示这些配置从window.config到分割面板渲染的完整链路。读完本文你将能够在零代码改造的前提下通过配置自定义分割表格形态、按钮显隐、统计标签文案、新建分割行为与编辑锁定策略。一、自定义服务分割面板定制的底层机制在深入分割面板的具体配置项之前有必要先理解 OHIF 的 Customization Service。正如 customizationService.md 所指出的customizationService 本身并不实现具体的定制逻辑它只负责注册可复用的原型、用实际配置去覆盖原型、并让消费方取到配置后的对象。真正的定制实现完全由支持定制的组件自己完成——分割面板正是这样的消费方。自定义项可以在三种作用域Scope下声明优先级从高到低依次为Global全局写在应用配置文件window.config的customizationService数组中作用于所有模式优先级最高Mode模式通过customizationService.setCustomizations(...)在某个模式内注册切换模式时自动清除Default默认扩展通过getCustomizationModule()以name: default导出作为兜底基线值。setCustomizations的第二个参数即作用域缺省为mode。例如在配置文件中全局定制window.config { // rest of window config customizationService: [ { panelSegmentation.tableMode: { $set: expanded, }, }, ], };定制语法一览定制语法借鉴 immutability-helper支持对数组与嵌套对象做精细化修改而不是粗暴的整体替换命令用途典型场景$set整体替换值用字符串、布尔值整体替换某个配置$push/$unshift向数组尾部/头部追加追加统计字段或菜单项$splice在指定索引插入/删除/替换精确调整数组中的某项$merge合并对象字段只改部分标签文案而不动其他字段$apply用函数动态计算新值在默认值基础上做变换$filter按 match 递归匹配后$merge/$set精准命中嵌套结构中的某项其中$merge是分割面板readableText等对象型配置最常用的命令——它只更新指定的字段其余字段保持默认不变。后续各节将围绕这些语法给出可直接复制的配置片段。二、panelSegmentation 自定义项总览Segmentation.md 通过渲染 sampleCustomizations.tsx 中导出的segmentationCustomizations数组共 5 个配置项来呈现全部可定制点其结构为自定义 ID描述默认值panelSegmentation.tableMode定义分割表格的显示模式collapsedpanelSegmentation.showAddSegment控制分割面板是否显示 Add Segment 按钮truepanelSegmentation.readableText定义分割面板统计指标的可读文本标签一组键值对对象panelSegmentation.onSegmentationAdd定义向面板添加新分割时的行为为活动视口创建 labelmap 的函数panelSegmentation.disableEditing是否禁用面板中的分割编辑false在 segmentationPanelCustomization.tsx 中这 5 个默认值均以default作用域注册同文件还额外注册了panelSegmentation.customDropdownMenuContent、panelSegmentation.customSegmentStatisticsHeader、labelMapSegmentationToolbox.config、contourSegmentationToolbox.config等面板相关定制点。在 PanelSegmentation.tsx 中面板通过customizationService.getCustomization(...)逐一读取这些值实现默认值可被配置覆盖的动态消费。三、控制分割表格形态panelSegmentation.tableMode分割面板将分段列表以表格形式呈现tableMode决定该表格默认是**折叠collapsed还是展开expanded**两种形态之一。默认值collapsed即每个分段默认只显示一行摘要适合分段数量较多、需要紧凑展示的场景可选值expanded展开显示更多细节信息便于快速查看各分段的统计与属性。分割表格 collapsed 折叠模式分割表格 expanded 展开模式全局配置改为展开模式window.config { // rest of window config customizationService: [ { panelSegmentation.tableMode: { $set: expanded, }, }, ], };从源码看segmentationPanelCustomization.tsx 中该值默认被设置为collapsed而 PanelSegmentation.tsx 在渲染表格前调用getCustomization(panelSegmentation.tableMode)获取最终生效值因此配置文件中的$set会在加载时覆盖默认值。若希望在不同模式间切换表格形态也可在模式的onModeEnter中调用setCustomizations而无需触碰全局配置。四、控制 Add Segment 按钮显隐panelSegmentation.showAddSegmentshowAddSegment用于控制分割面板顶部添加分段按钮是否显示。默认值true显示按钮允许用户手工向当前分割新增分段。Add Segment 按钮位置示意在只读展示、报告复核或禁止用户擅自新增分段的场景下可将该按钮隐藏window.config { // rest of window config customizationService: [ { panelSegmentation.showAddSegment: { $set: false, // Set to false to hide the Add Segment button }, }, ], };该配置为布尔开关通过$set整体替换为false即可生效。它常与第 6 节的disableEditing配合使用构成完全只读的分割面板既不允许新增分段也不允许编辑已有分段。五、定制统计标签文案panelSegmentation.readableText分割面板会针对每个分段显示一系列统计指标最小值、最大值、均值、体积、SUV 等这些指标在界面上的可读标签文本由readableText统一管理。默认值一组指标键 → 显示文本的映射对象文档中给出的默认值为{ lesionStats: Lesion Statistics, minValue: Minimum Value, maxValue: Maximum Value, meanValue: Mean Value, volume: Volume (ml), suvPeak: SUV Peak, suvMax: Maximum SUV, suvMaxIJK: SUV Max IJK, lesionGlyoclysisStats: Lesion Glycolysis, }需要说明的是这是分割面板统计表的高层可读文案默认值。在源码 segmentationPanelCustomization.tsx 中还存在一组更细粒度的默认值用于逐项指标按显示顺序排列{ min: Min Value, minLPS: Min Coord, max: Max Value, maxLPS: Max Coord, mean: Mean Value, stdDev: Standard Deviation, count: Voxel Count, median: Median, skewness: Skewness, kurtosis: Kurtosis, peakValue: Peak Value, peakLPS: Peak Coord, volume: Volume, lesionGlycolysis: Lesion Glycolysis, center: Center, }这些标签在 segmentationHandlers.ts 中通过getCustomization(panelSegmentation.readableText)被读取用于生成统计表格的表头文案。由于readableText是对象类型推荐使用$merge只覆盖需要改写的字段例如将 Lesion Statistics 改为更简洁的 Lesion Statswindow.config { // rest of window config customizationService: [ { panelSegmentation.readableText: { $merge: { lesionStats: Lesion Stats, }, }, }, ], };若使用$set整体替换则必须提供完整的键值对未提供的字段将失去默认文案因此对这类对象型配置$merge通常是更安全的选择。六、自定义新建分割行为panelSegmentation.onSegmentationAdd当用户点击添加分段或触发新建分割操作时面板会调用onSegmentationAdd定义的行为。这是 5 个配置项中唯一以函数为值的自定义点适合做业务级扩展。默认值为当前活动视口创建一个 labelmap 分割() { // default is to create a labelmap for the active viewport const { viewportGridService } servicesManager.services; const viewportId viewportGridService.getState().activeViewportId; commandsManager.run(createLabelmapForViewport, { viewportId }); }文档示例改为从 PTPET数据创建新的 labelmapwindow.config { // rest of window config customizationService: [ { panelSegmentation.onSegmentationAdd: { $set: () { const { viewportGridService } servicesManager.services; const viewportId viewportGridService.getState().activeViewportId; commandsManager.run(createNewLabelmapFromPT); }, }, }, ], };从源码实现看默认行为实际上比文档示例更完整 segmentationPanelCustomization.tsx 中的onSegmentationAdd接收segmentationRepresentationType参数默认Labelmap并分别处理Labelmap运行createLabelmapForViewport命令与Contour运行createContourForViewport命令并根据全局 CONTOUR 渲染填充样式状态决定是否订阅SEGMENTATION_STYLE_MODIFIED事件两种表示类型。这意味着在自定义该函数时若你的工作流涉及轮廓分割Contour需要留意表示类型的差异处理在$set自定义函数时函数内部可以访问commandsManager与servicesManager。七、锁定分割编辑panelSegmentation.disableEditingdisableEditing决定分割面板是否允许编辑已有分段例如修改分段颜色、标签、可见性等操作。默认值false即允许编辑。在需要严格锁定分割内容如已完成质控的标注、教学病例、只读报告的场景下可将其置为truewindow.config { // rest of window config customizationService: [ { panelSegmentation.disableEditing: { $set: true, // Disables editing of segmentations in the panel }, }, ], };该布尔开关在 PanelSegmentation.tsx 中通过getCustomization(panelSegmentation.disableEditing)读取并直接控制面板中编辑入口的渲染与交互。与showAddSegment: false组合后面板将呈现为纯粹的分段查看器。八、从配置到渲染一条完整的定制链路将以上内容串联起来一次分割面板定制的完整生命周期如下定义默认值extensions/cornerstone扩展在 getCustomizationModule.tsx或其引用的 segmentationPanelCustomization.tsx中以default作用域注册panelSegmentation.*各项默认值外部覆盖部署方在window.config的customizationService数组中Global 作用域用$set/$merge等命令覆盖上述默认值或由模式在运行时调用setCustomizationsMode 作用域动态注入运行时读取PanelSegmentation.tsx 与 segmentationHandlers.ts 通过customizationService.getCustomization(...)取到合并后的最终值并渲染优先级兜底Global Mode Default未配置的项自动回退到扩展默认值。因此修改分割面板行为时你完全不需要改动任何源码只需在配置文件或模式代码中按本文给出的 ID 与命令语法覆盖对应项即可。所有自定义 ID 的完整定义与示例配置都可以在 sampleCustomizations.tsx 中找到相关的定制机制细节可进一步参考 customizationService.md。九、实战建议小结优先使用$merge处理对象型配置如readableText避免$set覆盖导致未列字段丢失默认文案布尔开关showAddSegment、disableEditing用$set整体替换最直接行为型配置onSegmentationAdd注意分割表示类型Labelmap/Contour的差异自定义函数内部可通过servicesManager与commandsManager访问视图网格与命令系统作用域选择全站统一行为放window.configGlobal模式差异化行为在模式的onModeEnter中setCustomizationsMode扩展自带基线值以default命名导出。【免费下载链接】ViewersOHIF zero-footprint DICOM viewer and oncology specific Lesion Tracker, plus shared extension packages项目地址: https://gitcode.com/GitHub_Trending/vi/Viewers创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 OHIF Viewer 分割（Segmentation）面板自定义指南：从配置项到源码实现的完整解析
OHIF Viewer 分割Segmentation面板自定义指南从配置项到源码实现的完整解析【免费下载链接】ViewersOHIF zero-footprint DICOM viewer and oncology specific Lesion Tracker, plus shared extension packages项目地址: https://gitcode.com/GitHub_Trending/vi/ViewersOHIF Viewer 的分割面板Segmentation Panel承担着医学影像分割结果的组织、统计与交互操作功能。本文以version-3.11文档中 Segmentation Customization 为骨架系统讲解panelSegmentation.*系列自定义项的默认值、配置语法与实战示例并结合 segmentationPanelCustomization.tsx 与 PanelSegmentation.tsx 源码揭示这些配置从window.config到分割面板渲染的完整链路。读完本文你将能够在零代码改造的前提下通过配置自定义分割表格形态、按钮显隐、统计标签文案、新建分割行为与编辑锁定策略。一、自定义服务分割面板定制的底层机制在深入分割面板的具体配置项之前有必要先理解 OHIF 的 Customization Service。正如 customizationService.md 所指出的customizationService 本身并不实现具体的定制逻辑它只负责注册可复用的原型、用实际配置去覆盖原型、并让消费方取到配置后的对象。真正的定制实现完全由支持定制的组件自己完成——分割面板正是这样的消费方。自定义项可以在三种作用域Scope下声明优先级从高到低依次为Global全局写在应用配置文件window.config的customizationService数组中作用于所有模式优先级最高Mode模式通过customizationService.setCustomizations(...)在某个模式内注册切换模式时自动清除Default默认扩展通过getCustomizationModule()以name: default导出作为兜底基线值。setCustomizations的第二个参数即作用域缺省为mode。例如在配置文件中全局定制window.config { // rest of window config customizationService: [ { panelSegmentation.tableMode: { $set: expanded, }, }, ], };定制语法一览定制语法借鉴 immutability-helper支持对数组与嵌套对象做精细化修改而不是粗暴的整体替换命令用途典型场景$set整体替换值用字符串、布尔值整体替换某个配置$push/$unshift向数组尾部/头部追加追加统计字段或菜单项$splice在指定索引插入/删除/替换精确调整数组中的某项$merge合并对象字段只改部分标签文案而不动其他字段$apply用函数动态计算新值在默认值基础上做变换$filter按 match 递归匹配后$merge/$set精准命中嵌套结构中的某项其中$merge是分割面板readableText等对象型配置最常用的命令——它只更新指定的字段其余字段保持默认不变。后续各节将围绕这些语法给出可直接复制的配置片段。二、panelSegmentation 自定义项总览Segmentation.md 通过渲染 sampleCustomizations.tsx 中导出的segmentationCustomizations数组共 5 个配置项来呈现全部可定制点其结构为自定义 ID描述默认值panelSegmentation.tableMode定义分割表格的显示模式collapsedpanelSegmentation.showAddSegment控制分割面板是否显示 Add Segment 按钮truepanelSegmentation.readableText定义分割面板统计指标的可读文本标签一组键值对对象panelSegmentation.onSegmentationAdd定义向面板添加新分割时的行为为活动视口创建 labelmap 的函数panelSegmentation.disableEditing是否禁用面板中的分割编辑false在 segmentationPanelCustomization.tsx 中这 5 个默认值均以default作用域注册同文件还额外注册了panelSegmentation.customDropdownMenuContent、panelSegmentation.customSegmentStatisticsHeader、labelMapSegmentationToolbox.config、contourSegmentationToolbox.config等面板相关定制点。在 PanelSegmentation.tsx 中面板通过customizationService.getCustomization(...)逐一读取这些值实现默认值可被配置覆盖的动态消费。三、控制分割表格形态panelSegmentation.tableMode分割面板将分段列表以表格形式呈现tableMode决定该表格默认是**折叠collapsed还是展开expanded**两种形态之一。默认值collapsed即每个分段默认只显示一行摘要适合分段数量较多、需要紧凑展示的场景可选值expanded展开显示更多细节信息便于快速查看各分段的统计与属性。分割表格 collapsed 折叠模式分割表格 expanded 展开模式全局配置改为展开模式window.config { // rest of window config customizationService: [ { panelSegmentation.tableMode: { $set: expanded, }, }, ], };从源码看segmentationPanelCustomization.tsx 中该值默认被设置为collapsed而 PanelSegmentation.tsx 在渲染表格前调用getCustomization(panelSegmentation.tableMode)获取最终生效值因此配置文件中的$set会在加载时覆盖默认值。若希望在不同模式间切换表格形态也可在模式的onModeEnter中调用setCustomizations而无需触碰全局配置。四、控制 Add Segment 按钮显隐panelSegmentation.showAddSegmentshowAddSegment用于控制分割面板顶部添加分段按钮是否显示。默认值true显示按钮允许用户手工向当前分割新增分段。Add Segment 按钮位置示意在只读展示、报告复核或禁止用户擅自新增分段的场景下可将该按钮隐藏window.config { // rest of window config customizationService: [ { panelSegmentation.showAddSegment: { $set: false, // Set to false to hide the Add Segment button }, }, ], };该配置为布尔开关通过$set整体替换为false即可生效。它常与第 6 节的disableEditing配合使用构成完全只读的分割面板既不允许新增分段也不允许编辑已有分段。五、定制统计标签文案panelSegmentation.readableText分割面板会针对每个分段显示一系列统计指标最小值、最大值、均值、体积、SUV 等这些指标在界面上的可读标签文本由readableText统一管理。默认值一组指标键 → 显示文本的映射对象文档中给出的默认值为{ lesionStats: Lesion Statistics, minValue: Minimum Value, maxValue: Maximum Value, meanValue: Mean Value, volume: Volume (ml), suvPeak: SUV Peak, suvMax: Maximum SUV, suvMaxIJK: SUV Max IJK, lesionGlyoclysisStats: Lesion Glycolysis, }需要说明的是这是分割面板统计表的高层可读文案默认值。在源码 segmentationPanelCustomization.tsx 中还存在一组更细粒度的默认值用于逐项指标按显示顺序排列{ min: Min Value, minLPS: Min Coord, max: Max Value, maxLPS: Max Coord, mean: Mean Value, stdDev: Standard Deviation, count: Voxel Count, median: Median, skewness: Skewness, kurtosis: Kurtosis, peakValue: Peak Value, peakLPS: Peak Coord, volume: Volume, lesionGlycolysis: Lesion Glycolysis, center: Center, }这些标签在 segmentationHandlers.ts 中通过getCustomization(panelSegmentation.readableText)被读取用于生成统计表格的表头文案。由于readableText是对象类型推荐使用$merge只覆盖需要改写的字段例如将 Lesion Statistics 改为更简洁的 Lesion Statswindow.config { // rest of window config customizationService: [ { panelSegmentation.readableText: { $merge: { lesionStats: Lesion Stats, }, }, }, ], };若使用$set整体替换则必须提供完整的键值对未提供的字段将失去默认文案因此对这类对象型配置$merge通常是更安全的选择。六、自定义新建分割行为panelSegmentation.onSegmentationAdd当用户点击添加分段或触发新建分割操作时面板会调用onSegmentationAdd定义的行为。这是 5 个配置项中唯一以函数为值的自定义点适合做业务级扩展。默认值为当前活动视口创建一个 labelmap 分割() { // default is to create a labelmap for the active viewport const { viewportGridService } servicesManager.services; const viewportId viewportGridService.getState().activeViewportId; commandsManager.run(createLabelmapForViewport, { viewportId }); }文档示例改为从 PTPET数据创建新的 labelmapwindow.config { // rest of window config customizationService: [ { panelSegmentation.onSegmentationAdd: { $set: () { const { viewportGridService } servicesManager.services; const viewportId viewportGridService.getState().activeViewportId; commandsManager.run(createNewLabelmapFromPT); }, }, }, ], };从源码实现看默认行为实际上比文档示例更完整 segmentationPanelCustomization.tsx 中的onSegmentationAdd接收segmentationRepresentationType参数默认Labelmap并分别处理Labelmap运行createLabelmapForViewport命令与Contour运行createContourForViewport命令并根据全局 CONTOUR 渲染填充样式状态决定是否订阅SEGMENTATION_STYLE_MODIFIED事件两种表示类型。这意味着在自定义该函数时若你的工作流涉及轮廓分割Contour需要留意表示类型的差异处理在$set自定义函数时函数内部可以访问commandsManager与servicesManager。七、锁定分割编辑panelSegmentation.disableEditingdisableEditing决定分割面板是否允许编辑已有分段例如修改分段颜色、标签、可见性等操作。默认值false即允许编辑。在需要严格锁定分割内容如已完成质控的标注、教学病例、只读报告的场景下可将其置为truewindow.config { // rest of window config customizationService: [ { panelSegmentation.disableEditing: { $set: true, // Disables editing of segmentations in the panel }, }, ], };该布尔开关在 PanelSegmentation.tsx 中通过getCustomization(panelSegmentation.disableEditing)读取并直接控制面板中编辑入口的渲染与交互。与showAddSegment: false组合后面板将呈现为纯粹的分段查看器。八、从配置到渲染一条完整的定制链路将以上内容串联起来一次分割面板定制的完整生命周期如下定义默认值extensions/cornerstone扩展在 getCustomizationModule.tsx或其引用的 segmentationPanelCustomization.tsx中以default作用域注册panelSegmentation.*各项默认值外部覆盖部署方在window.config的customizationService数组中Global 作用域用$set/$merge等命令覆盖上述默认值或由模式在运行时调用setCustomizationsMode 作用域动态注入运行时读取PanelSegmentation.tsx 与 segmentationHandlers.ts 通过customizationService.getCustomization(...)取到合并后的最终值并渲染优先级兜底Global Mode Default未配置的项自动回退到扩展默认值。因此修改分割面板行为时你完全不需要改动任何源码只需在配置文件或模式代码中按本文给出的 ID 与命令语法覆盖对应项即可。所有自定义 ID 的完整定义与示例配置都可以在 sampleCustomizations.tsx 中找到相关的定制机制细节可进一步参考 customizationService.md。九、实战建议小结优先使用$merge处理对象型配置如readableText避免$set覆盖导致未列字段丢失默认文案布尔开关showAddSegment、disableEditing用$set整体替换最直接行为型配置onSegmentationAdd注意分割表示类型Labelmap/Contour的差异自定义函数内部可通过servicesManager与commandsManager访问视图网格与命令系统作用域选择全站统一行为放window.configGlobal模式差异化行为在模式的onModeEnter中setCustomizationsMode扩展自带基线值以default命名导出。【免费下载链接】ViewersOHIF zero-footprint DICOM viewer and oncology specific Lesion Tracker, plus shared extension packages项目地址: https://gitcode.com/GitHub_Trending/vi/Viewers创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考