cornerstoneWADOImageLoader-加载DICOM文件

使用文档

介绍

官方是这样子介绍简单概括的：用于通过HTTP请求WADO-URI或WADO-RS文件

WADO-URI与WADO-RS都是基于HTTP（或者HTTPS）协议之上的一种实现方式，WADO-URI采用的是HTTP的GET方法，通过URL配置参数的方式来完成DICOM数据的交互；WADO-RS同样采用HTTP的GET方法（当然后续扩展的数据上传采用的是HTTP的POST，这个后续会单独介绍）；WADO-WS采用的是HTTP的POST方法，通过SOAP协议的方式来完成DICOM数据的交互操作。

主要特征

• DICOM Part 10 images
• 支持 WADO-URI 和 WADO-RS 文件
• 支持多帧 DICOM 实例
• 支持从 File 对象读取 DICOM 文件

示列

1. git项目实例地址：cornerstoneWADOImageLoader/master/examples

2. 与connerstone结合的示例地址：https://github.com/chafey/cornerstoneDemo

安装

有两种引入方式，可结合自己的实际情况引入即可。

1. 静态资源引入，可根据自己的需要选择性引入即可。
   • 开发环境（不是最小化）：cornerstoneWADOImageLoader.js
   • 生产环境（最小化）：cornerstoneWADOImageLoader.bundle.min.js
2. npm安装

  npm i cornerstone-wado-image-loader
  import cornerstoneWADOImageLoader
  from 'cornerstone-wado-image-loader/dist/cornerstoneWADOImageLoaderNoWebWorkers.bundle.min'

用法

注意：cornerstoneWADOImageLoader依赖以下外部库，这些库应该在它之前加载：

• dicomParser：用于解析DICOM图像
  npm i dicom-parser
import dicomParser from 'dicom-parser/dist/dicomParser.min'
  注：对DICOM图像解析比较感兴趣的话，可以看看dcmjs
• cornerstone

• 为基石指定加载器：

  cornerstoneWADOImageLoader.external.cornerstone = cornerstone;

• 在代码中配置web work 框架

web workers 配置参数

var config = {
  maxWebWorkers: navigator.hardwareConcurrency || 1,
  startWebWorkersOnDemand: true,
};
cornerstoneWADOImageLoader.webWorkerManager.initialize(config);

完整示例代码

import * as  cornerstone from "cornerstone-core";
import dicomParser from 'dicom-parser/dist/dicomParser.min'
import cornerstoneWADOImageLoader
  from 'cornerstone-wado-image-loader/dist/cornerstoneWADOImageLoaderNoWebWorkers.bundle.min'

cornerstoneWADOImageLoader.external.cornerstone = cornerstone;
cornerstoneWADOImageLoader.external.dicomParser = dicomParser;

cornerstoneWADOImageLoader.configure({
  beforeSend: function (xhr) {
    const apiKey = localStorage.getItem('token');
    if (apiKey) {
      xhr.setRequestHeader('token', apiKey);
    }
  }
});

var config = {
  maxWebWorkers: navigator.hardwareConcurrency || 1,//创建web worker的最大数量，默认为1
  startWebWorkersOnDemand: true, //默认情况下在需要时才创建web worker,如果希望在项目初始化时创建可设置为：false
  taskConfiguration: {
    decodeTask: {
      initializeCodecsOnStartup: false,//默认情况下web worker 不会在启动时初始化图片解码器，如果希望开启设置为:true
    }
  },
};
cornerstoneWADOImageLoader.webWorkerManager.initialize(config);

export default {
  name: "WADO-index",
  mounted() {
    const element = this.$refs.WADO_wrap
    cornerstone.enable(element);
    cornerstone.loadAndCacheImage('wadouri:https://assets.qiesou.com/data/DownloadImage.dcm').then(image => {
      const viewport = cornerstone.getDefaultViewportForImage(element, image);
      cornerstone.displayImage(element, image, viewport);
    })
  }
}

欢迎大家对我以上概述不准确地方及时作出指正，谢谢！

每天免费领取外卖卷，点外卖更便宜！WX搜索:“一块吃外卖 ” 或 扫↓↓↓↓↓