如何使用 Cornerstone Dicom 查看器加载文件？答案

【问题标题】：How to load file using Cornerstone Dicom viewer?如何使用 Cornerstone Dicom 查看器加载文件？
【发布时间】：2018-02-01 00:25:52
【问题描述】：

我需要显示 dicom 图像，它只是一个可通过 URL 获得的 dicom 文件 (dcm)。我目前使用Cornerstone DICOM 查看器。我知道我需要一个图像加载器，但我对是使用 WADO 图像加载器还是 Web 图像加载器感到困惑。我不知道 DICOM 文件是否为“P10”。如果我只有一个指向 .dcm 文件的链接并希望将其加载到 Cornerstone 中，那么哪种图像加载器最好？

更新

看来cornestoneWADOImageLoader 可以很好地加载文件。您所要做的就是将 wadouri: 添加到 url 并传递给基石的 loadImage 函数（假设您设置了图像加载器）。

【问题讨论】：

标签： dicom

【解决方案1】：

如果它是有效的 DICOM 图像，则它是第 10 部分图像：

https://github.com/chafey/cornerstoneFileImageLoader

正如 Kritzel 所说，WADO 和网络图像是不同的格式。

【讨论】：

【解决方案2】：

cornestoneWADOImageLoader 会在 url 中加载带有 .dcm 的文件，您只需将 url 路径传递给cornestoneWADOImageLoader。这里是它的示例代码。要运行这个项目，您还需要拥有基石核心和 dicom 解析器

import React, { useEffect, useRef, useState } from "react";
import cornerstone from "cornerstone-core";
import dicomParser from "dicom-parser";
import * as cornerstoneWADOImageLoader from "cornerstone-wado-image-loader";

cornerstoneWADOImageLoader.external.cornerstone = cornerstone;

cornerstoneWADOImageLoader.external.dicomParser = dicomParser;

const Viewer = () => {
  const [a, setA] = useState(0);
  const divRef = useRef();
  const cvsRef = useRef();

  useEffect(() => {
    divRef.current = document.createElement("div");
    divRef.current.style.width = 500;
    divRef.current.style.height = 500;
    console.log(divRef.current);
    cornerstone.enable(divRef.current);
    cvsRef.current = divRef.current.getElementsByTagName("canvas")[0];
    cvsRef.current.width = 500;
    cvsRef.current.height = 500;
    cvsRef.current.style.width = "500px";
    cvsRef.current.style.height = "500px";
    cornerstone
      .loadImage(
        "wadouri:https://raw.githubusercontent.com/cornerstonejs/cornerstoneWADOImageLoader/master/testImages/CT2_J2KR"
      )
      .then(image => {
        console.log(image);

        cornerstone.displayImage(divRef.current, image);

        const viewport = {
          invert: false,
          pixelReplication: false,
          voi: {
            windowWidth: 400,
            windowCenter: 200
          },
          scale: 1,
          translation: {
            x: 0,
            y: 0
          }
          // colormap: "hot"
        };

        cornerstone.setViewport(divRef.current, viewport);
        cornerstone.updateImage(divRef.current);
        console.log(
          cvsRef.current.getContext("2d").getImageData(250, 250, 10, 10)
        );
        setA(2);
      });
  }, []);

  setTimeout(() => {
    console.log(
      cvsRef.current &&
        cvsRef.current.getContext("2d").getImageData(250, 250, 10, 10)
    );
  }, 1000);

  return (
    (divRef.current && (
      <div
        ref={node => {
          node.appendChild(divRef.current);
        }}
      />
    )) ||
    null
  );
};

export default Viewer;

【讨论】：

【解决方案3】：

据我所知：

WADO 图像加载器将无法工作，因为该图像“只是一个可通过 URL 获得的 DICOM 文件”。然而，WADO 是一个更复杂的协议。所以这会在服务器端失败
Web 图像加载器无法工作，因为它只支持“Web 图像” - PNG 和 JPEG

【讨论】：