REVOXELSEG_DICOM/工程分析/实现方案-2026-05-04-05-20-16.md

实现方案 - 2026-05-04-05-20-16

修改目标

围绕项目库 DICOM/3D 浏览体验和逆向工作区标题信息进行收敛修复，保证 DICOM 切片控制可连续移动、三平面可旋转且显示完整清晰，补充下载能力，并修复 3D 模型加载完成后仍不可见的问题。

涉及路径

• WebSite/server.ts
• WebSite/src/components/ProjectLibrary.tsx
• WebSite/src/components/ReverseWorkspace.tsx
• WebSite/src/lib/api.ts
• WebSite/src/types.ts
• 工程分析/经验记录.md

技术路线

1. DICOM 文件排序

   • 将 DICOM 文件列表改为基于文件名的自然排序，确保 1.dcm、2.dcm、10.dcm 顺序正确。

2. DICOM 重建与清晰度

   • 后端对矢状面/冠状面重建结果进行非黑边界裁切并保留安全边距，减少“只显示一半”的视觉问题。
   • 对预览灰度图做轻量边缘增强，提高 DCM 影像边界辨识度。

3. 切片控制与旋转

   • 前端新增上下箭头按钮，长按时用定时器连续推进或回退切片。
   • DICOM 三平面统一支持左/右 90 度旋转，旋转状态参与画布绘制和 PNG 导出。

4. 下载能力

   • 后端新增 DICOM 序列压缩包接口，使用 tar.gz 生成压缩包，不引入额外依赖。
   • 前端增加下载按钮，支持当前图片 PNG 和 DICOM 压缩包。

5. 3D 模型显示

   • 继续使用后端 STL 抽样预览，前端原生 Three.js 渲染。
   • 修正模型居中和相机适配逻辑，增加坐标轴容错、投影兜底和加载进度。

6. 逆向工作区

   • 去掉 Head_CT_DICOM ↔ Head_CT_ReConstruct 路径说明，仅保留当前项目、DICOM 数量、STL 数量等上下文。

数据流与交互流程

• 项目库加载项目 -> 选择 DICOM 面/模式/切片 -> 后端返回灰度预览 -> 前端 canvas 绘制并按旋转角度显示。
• 用户点击 PNG 下载 -> 使用当前 canvas 像素、平面、切片、模式、旋转角度生成命名完整的 PNG。
• 用户点击 DICOM 压缩包下载 -> 后端按文件名自然排序打包 Head_CT_DICOM。
• 用户进入 3D 模型页 -> 前端请求 STL 抽样预览 -> Three.js 居中缩放显示全部可见构件。

兼容性与回滚方案

• 若 DICOM 压缩包下载异常，不影响 DICOM 预览和 PNG 下载。
• 若 WebGL 不可用，仍保留二维 canvas 投影兜底预览。
• 回滚时可恢复本次提交前的 server.ts、项目库和逆向工作区组件。

预计文件变更

• 前后端代码 4-5 个文件。
• 本次流程文档 3 个文件。
• 经验记录追加 2-3 条。

人工审核状态

用户已在需求中明确：“本次的 需求分析、实现方案、测试方案、执行修改 都不用我人工二次确认了”。因此本方案记录后直接执行。