通过cornerstone解析多帧dicom图像

源码地址参照：cornerstone
 

loadAndViewImage(url) {
      var element = document.getElementById("dicom_canvas");
      cornerstoneWADOImageLoader.wadouri.dataSetCacheManager
        .load(url, cornerstoneWADOImageLoader.internal.xhrRequest)
        .then((dataSet) => {
          console.log(dataSet);
          var numFrames = dataSet.intString("x00280008");
          var FrameRate = 1000 / dataSet.floatString("x00280010");
          console.log(FrameRate);
          if (numFrames && numFrames > 1) {
            this.loaded = false;
            var imageIds = [];
            var imageIdRoot = "wadouri:" + this.url;
            for (var i = 0; i < numFrames; i++) {
              var imageId = imageIdRoot + "?frame=" + i;
              imageIds.push(imageId);
            }
            console.log(imageIds);
            var stack = {
              currentImageIdIndex: 0,
              imageIds: imageIds,
            };
            cornerstone.loadAndCacheImage(imageIds[0]).then(
              (image) => {
                cornerstoneWADOImageLoader.wadouri.dataSetCacheManager.unload(
                   this.url
                );
                cornerstone.displayImage(element, image);
                if (this.loaded === false) {
                  // cornerstoneTools.wwwc.activate(element, 1);
                  cornerstoneTools.addStackStateManager(element, [
                    "stack",
                    "playClip",
                  ]);
                  cornerstoneTools.addToolState(element, "stack", stack);
                  cornerstoneTools.playClip(element, FrameRate);
                }
              },
              function (err) {
                alert(err);
              }
            );
          } else {
            console.log("单帧");
            try {
              cornerstone.loadAndCacheImage("wadouri:" + this.url).then(
                (image) => {
                  // var viewport = cornerstone.getDefaultViewportForImage( element, image);
                  cornerstoneWADOImageLoader.wadouri.dataSetCacheManager.unload(
                    "wadouri:" + this.url
                  );
                  cornerstone.displayImage(element, image);
                },
                function (err) {
                  throw err;
                }
              );
            } catch (err) {
              console.log(err);
            }
          }
        });
    },
    Dicom() {
      var element = document.getElementById("dicom_canvas");
      cornerstone.enable(element);
      cornerstoneWADOImageLoader.external.dicomParser = dicomParser;
      cornerstoneWADOImageLoader.external.cornerstone = cornerstone;
      cornerstoneWebImageLoader.external.cornerstone = cornerstone;
      cornerstoneWebImageLoader.external.cornerstoneMath = cornerstoneMath;
      cornerstoneTools.external.cornerstoneMath = cornerstoneMath;
      cornerstoneTools.external.cornerstone = cornerstone;
      cornerstoneTools.external.Hammer = Hammer;
      cornerstone.registerImageLoader(
        "http",
        cornerstoneWebImageLoader.loadImage
      );
      cornerstone.registerImageLoader(
        "https",
        cornerstoneWebImageLoader.loadImage
      );
      cornerstoneTools.init();
      let url;
      url = this.url;
      this.loadAndViewImage(url);
    },