2. 南京医科大学第一附属医院 骨科, 南京 210029
2. Department of Orthopedics, the First Affiliated Hospital, Nanjing Medical University, Nanjing 210029, China
随着互联网的发展和时代的进步, 计算机技术被广泛应用于医学, 因为网络的便捷和普及, 以浏览器为基础的网络技术得到了发展, 在大量软件应用设计中, 客户端/服务器(Client/Server, C/S)逐渐不再满足需要, 浏览器/服务器(Browser/Server, B/S)结构得到了人们的青睐[1]. 现有的Mimics等医疗软件不仅需要安装应用程序, 而且操作也十分麻烦. Web应用因为其无需安装并且更新维护方便的特点, 吸引了越来越多的学者的注意, 设计了许多基于Web的医学可视化系统. 如李伟波等人开发了医学图像处理系统, 实现在线提交、在线阅览[2]; 李炜等人为医疗措施不完善地区开发了一对一远程医疗系统, 实现病患远程会诊[3]; 黄志峰等人基于Node.js技术开发了病理对照检索系统[4]; 陈哲等人开发了医学图像半自动标注系统, 解决了手工标注劳动强度大的问题[5]; 汤超、王常坤等人开发了阅片系统[6,7]; Jong等人开发了收集血压和心脏病例的Web系统用于跟踪用户的健康状况[8]; 陈欣等人开发了具有三维可视化功能的电子书签系统, 辅助影像诊断[9]; 聂泽花等人开发了影像存储共享系统, 实现临床示教过程中影像的快速共享[10]; Rybarczyk等人开发了动作矫正平台用来指导髋关节置换术后患者的康复训练[11]; 万兵等人开发了医疗影像共享平台[12]; 何滋鱼、董默、刘兆明等人开发了三维重建系统, 实现模型的三维重建[13-15]; Popescu等人开发了骨科协作平台用于为用户提供指南和信息共享[16]. 但这些系统并不是专门针对于下肢骨畸形问题, 无法满足下肢骨畸形手术辅助诊断的需要.
为了达到对下肢骨畸形手术提供辅助作用的目的, 设计了一种基于开源架构的下肢骨畸形在线辅助诊断仿真系统. 该系统主要由3部分构成, 包括浏览器、服务器和后台处理程序.
1 需求分析当前医生诊断时所采用的辅助系统大多数是一些二维影像浏览平台, 辅助功能极其有限. 首先, 二维影像无法让我们从整体上观察和分析双下肢各骨骼的相对空间关系; 其次, 从图像上无法实现多角度观察和分析畸形部位的特征和空间位置关系; 最后, 图像中包含的细节信息医生也无法完全掌握.
为了满足辅助医生诊断的需要, 本文设计的基于开源架构的下肢骨畸形在线辅助诊断仿真系统, 需要构建下肢骨三维重建模块, 以取代Mimics等繁琐、费时的商业软件, 为医生提供用于三维分析的股骨、胫骨和腓骨精细模型; 需要构建人工关节模块, 以满足关节置换等手术的需要; 需要构建包括测量工具、细节查看、精确定位等在内的多种影像观察与辅助诊断工具, 以满足畸形部位定性定量需要; 需要建立信息管理模块, 以完成DICOM影像和三维模型信息的存储, 便于医生随时在线查看病例资料, 便于病情的追踪.
2 系统设计 2.1 总体设计本系统以为下肢骨畸形诊断与手术规划提供辅助支持为重点, 总体框架如图1所示, 包括用户层、前端表现层、数据层与业务逻辑层4个部分. 用户层包括各大浏览器, 无需下载插件, 任何一部电脑都可以快速实现操作; 前端表现层包括登录注册、数据可视化、下肢骨三维重建、人工关节和信息管理等5个功能模块; 业务逻辑层完成了客户端和服务器的规则制定; 数据层包括BMP、DICOM图像、OBJ模型、套图压缩文件等.
![]() |
图 1 系统框架图 |
2.2 系统详细设计
Web客户端是进行数据可视化和人机交互操作的界面, 功能设计方面必须满足用户的需求. 主界面主要分为4个区域, 分别是目录树区域、工具栏区域、可视化窗口和信息显示窗口.
二维可视化: 为了方便用户通过浏览图像, 寻找畸形部位. 系统需要实现二维图像的可视化, 包括BMP、DICOM等格式单张或批量图像的加载显示. 并且需要在前端平台编制各种辅助性功能的工具, 实现对图像的标注、测量、播放等交互操作, 以达到手术辅助效果. 二维可视化主要在Cornerstone.js的基础上开发, 二维交互工具主要基于CornerstoneTools.js完成.
三维可视化: 由于二维图像并不能充分的显示畸形部位的特征和位置关系, 难以使用户对畸形有准确的认知, 这就需要系统实现三维模型的重建与可视化, 这里主要包括3个模块: OBJ模型可视化、下肢骨三维重建和人工关节重建. 分别实现了: 三维OBJ模型的可视化; 股骨、胫骨和腓骨的三维重建及可视化; 人工关节和缺损骨骼的三维重建及可视化, 如图2所示. 其中模型在前端的显示、交互工具的编写主要基于Three.js库, 后台的三维重建程序主要基于VTK实现.
![]() |
图 2 系统功能框架 |
3 系统实现 3.1 开发环境
(1) Django框架
Django是使用Python 语言开发的、采用了MTV框架模式的Web开源框架. 即M (Model): 代表数据层, 通过编写算法, 从数据库中获取数据; T (Template): 代表前端表现层, 负责页面的展示; V (View): 代表业务逻辑层, 负责完成前后端逻辑的制定, 如图3所示.
Django工具多、框架大、要素已集成且全面, 使用简单方便. 结合Python语言成为快速开发网站的最优组合. 借此开发人员可以轻松地完成网站的编写.
![]() |
图 3 Django MTV框架 |
(2) Three.js与VTK开源库
3D技术具有十分明显的优点, 它可以使用户更加直观的浏览所需内容. 但Mimic等3D软件需要安装, 不易于操作. 实现网页三维模型可视化也面临着诸多困境. WebGL的出现解决了这个问题, WebGL是一种符合HTML5规范的3D图像绘制标准, 它为Canvas标签提供了渲染服务, 开发人员可以通过JS语言实现三维图形的绘制, 自由展示模型. 原生WebGL开发困难, Three.js是基于原生WebGL封装的3D引擎库, 使接口更简单. 封装了调整对象展示所需的场景、相机、决定绘制方式的渲染器等要素. 无需专业的学习就可以让用户简单的制作三维模型.
VTK (Visualization ToolKit)是一个基于C++开发的、以OpenGL为基础发展起来的开源跨平台库. 其具有面向Python的接口, 满足Python编程的需要; 通过将一些常用的算法封装好, 使我们无需重复编写, 如MC面绘制算法; 具有强大的图形处理和三维可视化功能. 后台三维重建程序主要基于VTK开源架构实现. 三维可视化的实现主要依靠于后台处理程序, 客户端只返回显示程序最终结果.
(3) Cornerstone.js与CornerstoneTools.js开源库
Cornerstone.js是一个开源库, 支持DICOM格式在内的医学图像在Web浏览器中交互和显示, 实现了基于Web的医学平台的建立. CornerstoneTools.js是在Cornerstone.js的基础上开发的一个开源工具集合库, 是位于Cornerstone底层库和Web上层应用之间的中间层. 开发这个工具库的主要目的在于: (1)是为了减少在开发医疗平台前端时的工作量; (2)是为了使网站上所涉及的工具, 特别是界面交互工具, 都保持良好一致性. CornerstoneTools.js提供了大量医学影像基础和常用工具.
3.2 功能实现 3.2.1 三维模型构建(1)下肢骨三维模型构建
下肢骨三维重建是本系统中研发的最重要的两个功能模块之一, 通过JS撰写浏览功能上传文件, 前端的请求会以字符串形式提交至后台, 由Web服务器接收并置于JSON中, 调用OpenCV、Skimage、VTK等开源架构编写后台去床程序、分离程序、补洞程序和三维重建程序, 调用Three.js、jQuery.js等开源架构编写前端模型射线点拾取、画板工具, 逐步对套图进行处理, 将渲染后的结果以二维形式与JSON字符串传至客户端并且显示.
下肢骨三维重建模块实现了下肢骨的高度自动化精细三维重建, 步骤流程如算法1.
算法1. 下肢骨三维重建
输入: DICOM压缩文件
输出: 股骨、胫骨、腓骨精细模型
1. 在前端输入压缩文件, 转化为JSON格式通过AJAX传入后台, 后台接收并转换解压;
2. 自动运行后台去床程序, 同时完成CT扫描床和噪声的去除, 并将图片的格式转换为BMP格式;
3. 自动运行后台髋关节分离程序, 得到待处理髋关节样图, 将髋关节样图返回前端显示;
4. 通过JS编写的画笔和橡皮等人机交互工具完成画板上样图的处理, 将处理后的样图转换为base64格式封装到blob对象中, 通过AJAX以JSON格式传到后台并解码为图像保存;
5. 自动运行后台踝关节分离程序, 通过前端三维模型射线点拾取, 得到待处理踝关节样图, 将踝关节样图返回前端显示;
6. 执行步骤4相同操作;
7. 自动运行后台上下腿骨、胫腓骨分离程序, 得到待处理样图, 将样图返回前端显示;
8. do
9. 换页, 执行步骤4相同操作;
10. While下腿骨和腓骨样图未处理完
11. 得到股骨、胫骨、腓骨3套图像;
12. 自动运行后台MC面绘制程序, 完成股骨、胫骨和腓骨的三维重建, 生成3个独立模型. 并且决定是否调用补洞程序;
13. 如果选择继续, 自动运行后台CPU并行补洞程序, 完成孔洞修补. 将结果OBJ显示在系统窗口中并控制各部分显示/隐藏.
此下肢骨三维重建模块的好处在于后台程序自动完成CT扫描床去除、噪声去除; 剔除了盆骨、脚骨; 并且将下肢骨分为股骨、腓骨和胫骨3个独立模型, 如图4所示, 减少对象间的干扰, 方便单个模型畸变识别观察, 并实现了孔洞修补, 生成精细模型, 为以后研究的模拟矫正打下坚实基础. 全过程除少量人工干预, 基本实现自动化, 傻瓜式、流水式的操作, 使用户无需过多学习专业知识就能完成下肢骨三维重建, 操作步骤的简易性使得软件更容易推广.
(2)人工关节三维模型构建
人工关节模块是系统最重要的两个模块之一, 人工关节模块主要用于人工关节置换等手术后复查, 对人工关节和相邻骨骼进行三维重建, 通过前端上传压缩文件, 后台接收解压, 调动人工关节重建程序, 分别完成人工关节和骨骼的三维重建, 如图5所示, 并在前端窗口显示. 该模块实现了一键自动重建, 用户无需人工干预. 前端窗口可以显示多个三维模型, 各模型可以控制显示或隐藏, 在Three.js的支持下实现旋转、放大、缩小等三维交互操作, 便于用户观察细节, 分析手术情况.
![]() |
图 4 三维可视化界面 |
![]() |
图 5 人工关节界面 |
该模块在术后复查或者多年以后人工关节磨损替换中, 具有较高的作用. 用户能够根据相关影像建立人工关节和下肢骨的三维模型, 便于手术前计划的制定和人工关节磨损情况的定期复查, 使用户更好的掌握病情及术后康复情况.
3.2.2 影像观察与辅助诊断工具(1)影像对比观察
系统实现了双视图对比查看, 通过分窗显示功能, 在不同的窗口显示不同的影像, 既可以是同一期不同位置的影像, 也可以是不同时期拍摄的影像. 通过双视图对比, 我们可以清楚的发现畸形区域, 不同时期的图像对比也方便医生追踪术前畸形的变化情况和术后畸形的康复情况.
(2) DICOM动态展示
实现DICOM文件的动态展示. 在cornerstone.js的支持下, 客户端上传压缩文件, 调用后台解压处理程序完成解压处理, 指定加载列表, 进入DICOM套图可视化界面. 通过手动或自动模式的播放, 实现DICOM动态展示功能. 便于医生快速掌握下肢骨整体情况和快速定位畸形位置.
(3)辅助诊断工具
在cornerstoneTools.js的基础上完成工具栏的建设, 实现测量工具、灰度变换、细节查看、精确定位和影像浏览5个二维交互功能模块, 如图6所示.
1)测量工具
在诊断中, 为了对畸形区域进行定性和定量的表示. 系统设计了角度测量、灰度测量、直线测量和面积测量4种测量工具, 其中面积测量分为: 椭圆面积测量、长方形面积测量和自由测区测量以及相应的清除、扩展、保存、恢复上次保存等功能, 如图7所示.
![]() |
图 6 辅助诊断工具 |
![]() |
图 7 二维交互界面 |
2)灰度变换
在诊断中, 为了更好的观察畸形部位和下肢骨组织, 改善图像画质. 设置鼠标点击事件, 通过按住鼠标上下拖动实现调整窗位/窗宽或进行反色显示. 使图像层次更加丰富, 不同组织更容易分辨.
3)细节观察
在诊断中, 为了使医生更加方便观察畸形部位的细节. 通过调整Canvas坐标和图像坐标之间的变换矩阵实现放大、缩小、位移等功能.
4)精确定位
在诊断中, 为了使医生能够快速定位显示可疑切片. 通过在主窗口左侧批量显示缩略图, 实现缩略图点击可视化的功能. 医生通过浏览缩略图, 实现诊断过程中的畸形精准定位.
3.2.3 信息管理信息管理模块用于管理记录病人的基本信息. 包括: Patient Tag: 患者姓名、出生日期、性别、身高体重等; Study Tag: 检查日期、检查部位、检查时年龄等; Seriesm Tag: 图像方位、层厚等; Image Tag: 总行数、总列数、像素间距等信息, 还包括仪器型号、所在单位等信息, 还管理了DICOM影像和三维模型存储信息, 可供医生随时在线查看病例资料, 便于病情在线诊断与跟踪.
4 系统测试系统以Pycharm2019为开发平台进行设计, 整体架构为B/S结构, 客户端采用Chrome浏览器; Web服务器采用Django框架; 数据库使用MySQL; 后台程序采用Python语言. 以AJAX通讯; 数据通信采用JSON格式. 数据采用大小为512×512的患者下半身DICOM影像.
测试机型为笔记本电脑, 配置为CPU: 酷睿i74510U处理器, 内存: 4 GB, 显卡: 英特尔HD Graphics Family. 使用Win10 系统的IE浏览器、Chrome浏览器、Google浏览器和360浏览器进行测试. 运行结果表明4种浏览器都能很好地显示图像, 工具栏工具均能实现, 系统运行速度也能满足实际需要. 具体运行结果以Google浏览器为例说明.
系统主界面如图8所示, 图8(a)左侧为菜单目录树区域, 中间窗口为DICOM加载可视化, 右下侧为工具栏区域. 图8(b)为下肢骨三维重建后, 返回结果三维可视化, 模型成功剔除盆骨、脚骨, 完成股骨、胫骨和腓骨的分离, 生成的模型光滑无洞, 细节处理较好, 可以控制每个骨头显示或者隐藏, 对于畸变识别非常有利. 图8(c)为人工关节重建后的人工关节可视化, 可以通过按钮控制人工关节和骨骼的显示. 图8(d)为DICOM套图批量可视化子窗口, 窗口左侧为缩略图窗口, 上方为工具栏, 可实现多种交互操作.
![]() |
图 8 主界面及各子界面 |
5 结论
本系统基于下肢骨畸形手术的需要, 开发了一种基于开源架构的下肢骨畸形在线辅助诊断仿真系统, 用于帮助用户寻找畸形. 实验结果显示, 该系统可视化清晰、功能全面并且基本实现自动化、操作简单无需较多的专业知识、基于B/S架构无需下载插件, 能够满足早期软件设计的需要. 其实用价值较高, 既能在前期从二维和三维方向辅助医生快速的找到畸形问题, 又能为后期人工关节置换等手术复查中提供确切资料, 所存储的病例信息也可以被用户随时查阅比较, 便于掌握病情进展状况. 该系统具有很大的潜力, 下一步将要研究如何在系统上实现畸形的自动识别与矫正.
[1] |
贾春乐. 基于B/S结构的网上医疗系统的设计与实现[硕士学位论文]. 西安: 西安电子科技大学, 2013.
|
[2] |
李伟波, 鲍苏苏, 李健壮. 基于Web医学图像可视化系统应用研究. 计算机与现代化, 2012(7): 92-95. DOI:10.3969/j.issn.1006-2475.2012.07.025 |
[3] |
李炜, 黄倩. 基于Web的远程医疗系统的开发与设计. 电子设计工程, 2017, 25(3): 19-22, 27. |
[4] |
黄志峰, 王晓阳, 付丽媛, 等. 基于Web与Node. js的医学影像与病理结果对照检索系统平台的设计与实现. 医疗卫生装备, 2017, 38(11): 51-54, 58. |
[5] |
陈哲, 黄巍, 陈昭. 基于Web应用的医学图像半自动标注系统. 计算机应用与软件, 2019, 36(10): 1-5. DOI:10.3969/j.issn.1000-386x.2019.10.001 |
[6] |
汤超, 苑金龙, 夏超. 基于B/S结构的医学影像阅片系统研究与设计. 计算机与数字工程, 2014, 42(2): 311-314, 336. DOI:10.3969/j.issn.1672-9722.2014.02.034 |
[7] |
王常坤. 基于Web的医学图像传输和显示系统的设计与实现[硕士学位论文]. 武汉: 武汉理工大学, 2015.
|
[8] |
Jong GJ, Aripriharta, Hendrick, et al. Fuzzy inference engine integrated with blood pressure and heart variability for medical Web platform. Wireless Personal Communications, 2017, 92(4): 1695-1712. DOI:10.1007/s11277-016-3629-6 |
[9] |
陈欣, 郑孝宗, 乔梁. 基于B/S结构的医学影像3D电子书签系统设计与实现. 中国数字医学, 2014, 9(10): 15-18. DOI:10.3969/j.issn.1673-7571.2014.10.004 |
[10] |
聂泽花, 尚珍. 基于Web医学影像的DICOM图像应用. 医学信息学杂志, 2016, 37(12): 42-46. DOI:10.3969/j.issn.1673-6036.2016.12.010 |
[11] |
Rybarczyk Y, Deters JK, Cointe C, et al. Smart Web-based platform to support physical rehabilitation. Sensors, 2018, 18(5): 1344. DOI:10.3390/s18051344 |
[12] |
万兵, 汪利琴, 刘沛武. B/S模式下三维可视化医学影像系统的设计. 中国医疗设备, 2019, 34(8): 105-107, 119. DOI:10.3969/j.issn.1674-1633.2019.08.024 |
[13] |
何滋鱼, 周宇, 朱振国, 等. 基于OpenGL ES的移动端DICOM图像三维重建技术. 中国医学物理学杂志, 2017, 34(10): 1018-1021. DOI:10.3969/j.issn.1005-202X.2017.10.010 |
[14] |
董默, 赵若晗, 周志尊, 等. 医学图像三维重建系统设计与应用. 软件, 2018, 39(1): 87-90. DOI:10.3969/j.issn.1003-6970.2018.01.017 |
[15] |
刘兆明, 郭景, 柯永振. 面向Web的远程图像可视化系统的研制. 计算机应用与软件, 2018, 35(6): 190-196, 262. DOI:10.3969/j.issn.1000-386x.2018.06.034 |
[16] |
Popescu D, Ilie C, Laptoiu D, et al. Web-based collaborative platform for personalized orthopaedic applications. Studies in Informatics and Control, 2016, 25(4): 517-526. |