vue展示医学数字影像和通讯文件医疗系统的实现代码

环境：vue、webpack、constone

资料来源及文件：https://github。com/GleasonBian/cornerstonewedo

需要下载的模块：基石核心、dicom解析器

需要下载的射流研究…文件：压缩文件可以忽略

显示组件：showDicom.vue

模板div class=' DICOM ' ref=' dicomImage '/div/template script import *作为来自基石核心的基石；从" dicom解析器"导入*作为dicomParser//不建议新公共管理安装角石DOImageLoader如果你做了会很头疼让cornerstonedooimageloader=require('./././static/dist/cornerstone doimageloader。js ')//从导入{ cornerstoneWADOImageLoader }./././static/dist/cornerstone doimageloader。js '；//指定要注册加载程序的基石实例cornerstonedoimageloader。外部。基石=基石；//配置webWorker(必须配置)//注意这里的路径问题如果路径不对cornerstonedoimagedloaderwebworker会报错index.html未捕获语法分析器：意外标记var config={ WebWorkerPath : '/static/dist/cornerstonedoimageloaderWebWorker。js '，tasks configuration : { decodateask : { codecspath : '/static/dist/cornerstonediomageloadercode cs。js ' } } } }cornerstonedoimageloader。webworkermanager。初始化(配置)；导出默认值{ name: 'previewDicom '，prop : { imageId : { type : String，required: true } }，data(){ return } }，//watch : {//imageId(新值，旧值){//var URL=` wadou : $ { this。imageId } `；//这个。加载视图图像(网址)；//}/}，mounted(){ var URL=` wado uri : $ { this。imageid } `；这个。加载视图图像(网址)；}，方法： { LoadView image(ImageID){//找到要放置医学数字影像和通讯图像的元素//var元素=文档。getelementbyid(' dicomImage ')；控制台。日志(1334)；让元素=这个参考文献。dicomimage基石。使能(元素)//基石。loadandcacheimage函数负责加载图形需要图像地址图片的编号基石。loadAndCacheImage(imageId).然后(函数(图像){ var viewport=cornerstone。图像的getdefaultviewport(元素，图像)；基石。显示图像(元素、图像、视口);},函数(错误){控制台。err(err)})；} } }/脚本样式范围。DICOM {高度： 100%；}/样式引入组件，注册，使用：

div class='son' v-for='(item，key)在dicomList ' : key=' key ' @ click=' imgClcik(item。URL)'预览-DICOM : imageid='项。URL '/预览-DICOM/div Dicom list 3360[{ URL : ' http://127。0 .0 .1/testDICOM/CTStudy/3.719 kb。DCM '，}，{ URL :显示结果：

总结

以上所述是小编给大家介绍的某视频剪辑软件展示医学数字影像和通讯文件医疗系统的实现代码，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！