前言

从0上手Cornerstone3D系列的git库终于有时间更新优化了一版。主要更新以下内容：

✨ vue2更新至vue3版本，代码迁移为vue3组合式写法

✨ UI风格升级，新增交互提示

✨ 修复页面切换报错问题

✨ …

关于git库

🎯 地址：https://github.com/jianyaoo/vue-cornerstone-demo

⛳️ 该仓库为从0开始上手 Cornerstone3D 的演示示例，从基础的影像渲染、工具运用，会逐步延展至业务需求、自定义工具类等场景，后续会有源码解析环节，与博客内容保持基本一致。

🚀 目前Vue版本已由2.6升级至Vue3，打包工具为webpack，node版本18.16.0。项目中webpack的配置已解决部分新上手时问题，如果是使用vite打包可查看vite构建

🎉 🎉 🎉 仓库将持续更新，欢迎大家Star&Fork，在使用Cornerstone过程中遇到任何问题或需要的示例欢迎随时issues或者掘金留言讨论。

代码部分截图

渲染栈影像

渲染volume影像

渲染PET模式

基础工具使用

博客汇总

🌾 图解系列

• 一文(10图)了解Cornerstone3D核心概念(万字总结附导图)
• 一文(N长图)了解Cornerstone3DTools常用工具(万字总结附导图)

🌿 基础概念系列

• 如何渲染一个基础的Dicom文件
• 如何使用Cornerstone加载本地的dicom文件并渲染
• 如何加载nifti格式的文件

🌴 场景及原理解析系列

• 获取Dicom文件某点CT值的实践方案
• 一文了解Cornerstone3D中窗宽窗位的3种设置场景及原理

🍂 踩坑记录

• Cornerstone3D导致浏览器崩溃的踩坑记录
• 记录vite项目中Cornerstone的兼容问题