Dicom 파일 핸들링 라이브러리 (feat. js)

dicomParser

https://cornerstonejs.github.io/dicomParser/examples/index.html

https://cornerstonejs.github.io/dicomParser/examples/index.html

import dicomParser from "dicom-parser";

 

포맷명을 ^ 를 구분자로 구분해준다.

// 구분해준 배열의 0, 1번째에 존재하는 것으로 환자의 이름을 출력해줄 수 있는 함수
const formatName = (string) => {
  let name = string.split("^");
  return `${name[0]}_${name[1]}`;
};

 

dicomParser.parseDicom()

파라미터로 Uint8Array의 byteArray 속성을 넣어주면 다이콤의 dataSet을 반환한다.

해당 dataSet은 string('x태그8자리') 형태로 다이콤 태그에 접근이 가능해진다.

 

파일을 첨부하여 다이콤 파일을 읽어오는 핸들러

const handleChange = (ev) => {
  let reader = new FileReader();
  let file = ev.target.files[0]; //input file 타입을 읽어오려면 0번째 files를 가져와야 함
  console.log(file)
  reader.readAsArrayBuffer(file);

// readAsArrayBuffer 가 다 끝난 다음에 수행
  reader.onload = (ev) => {
    try {
      let arrayBuffer = reader.result;
      let byteArray   = new Uint8Array(arrayBuffer);

      let dataSet     = dicomParser.parseDicom(byteArray);
      
      let patientName = formatName(dataSet.string("x00100010"));
      let patientId   = dataSet.string("x00100020");
      let patientDob  = dataSet.string("x00100030");
      let patientSex  = dataSet.string("x00100040");
      let scanOpt     = dataSet.string("x00180022");
      let encodingOpt = dataSet.string('x00080102');

      console.log("Patient Name          = " + patientName);
      console.log("Patient ID            = " + patientId);
      console.log("Patient Date of Birth = " + patientDob);
      console.log("Patient Gender        = " + patientSex);
      console.log("Scan optionss         = " + scanOpt);
      console.log('Encoding type         = ' + encodingOpt);
    } catch (error) {
      // alert("Please Select a valid dcm file");
      console.log("Error : " + error);
      // location.reload();
    }
  };

 

Hammerjs

https://hammerjs.github.io/

Hammer.JS - Hammer.js

모바일의 스크롤, 스와이프 등을 구현하기 위해 사용하는 라이브러리 - 웹앱에서 주로 사용

import Hammer from 'hammerjs';

 

 

Cornerstonejs & CornerstoneTools

https://www.cornerstonejs.org/

Cornerstone.js | Cornerstone.js

의료용 웹 어플리케이션 제작을 위한 통합 이미징 플랫폼, WebGL을 사용하며 CornerStrone3DTools와 함께 사용하게 된다.

import cornerstone from 'cornerstone-core';
import cornerstoneWADOImageLoader from 'cornerstone-wado-image-loader';
import cornerstoneWebImageLoader from 'cornerstone-web-image-loader';
import cornerstoneMath from 'cornerstone-math';
import cornerstoneTools from 'cornerstone-tools';

• DICOM 파싱
• Transfer Syntax 지원
• WADO-URI, WADO-RS 지원
• 웹 워커를 이용한 고성능 멀티스레드 이미지 디코딩 가능
• 모듈로 설계되어 쉽게 확장 가능

cornerstone-wado-image-loader

이미지 로더로 wado 호환 및 dicom 서버에서 이미지 로드

WADO

DICOM 프로토콜을 사용하여 의료 영상을 저장하고 검색하기 위한 표준

*dicomParser와 cornerstone 라이브러리에 의존한다(설정 필요)

cornerstone-web-image-loader

웹 이미지(png, jpeg)를 위한 코너스톤 이미지 로더

 

초기 설정

cornerstoneTools.external.cornerstone = cornerstone;
cornerstoneTools.external.Hammer = Hammer;
cornerstoneTools.external.cornerstoneMath = cornerstoneMath;
cornerstoneWebImageLoader.external.cornerstone = cornerstone;
cornerstoneWADOImageLoader.external.cornerstone = cornerstone;
cornerstoneWADOImageLoader.external.dicomParser = dicomParser;

cornerstoneTools.init();

// 옵션 추가
cornerstoneTools.init({
  mouseEnabled: true,
  touchEnabled: true,
  globalToolSyncEnabled: false,
  showSVGCursors: false,
});

cornerstoneWADOImageLoader.webWorkerManager.initialize({
  maxWebWorkers: navigator.hardwareConcurrency || 1,
  startWebWorkersOnDemand: true,
  taskConfiguration: {
    decodeTask: {
      initializeCodecsOnStartup: false,
      usePDFJS: false,
      strict: false,
    },
  },
});

 

다이콤 파서는 괜찮은데 아직 코너스톤은 잘모르겠다. 이거저거 기능을 사용해보곤 있지만 워낙 기능이 많다보니 끝이 없는 느낌이다.