request hundreds images by http

Hi All,

I use vtk-js and which reader should I use to request hundreds of dicom images by http? And is there any concrete example ?

Many thanks!

I need to download hundreds dicom images for volume render. In Python I can download all files and put in the same folder and then load together. In js I cannot find the correct reader.

vtk.js doesn’t have a dicom reader by itself. However, we can integrate with itk.js via vtkITKHelper.

Thanks your reply.

You mean first download all dicom file and then read by itk and then convert to vtk image?

Yep! That’s the most straightforward way to do it.

Just to clarify: when you say “download all files and put in the same folder and then load together”, are you downloading slices/images in a single series, and then reconstructing a single volume? Or are you reconstructing multiple volumes?

Images in a single series, then reconstructing a single volume. After download images and then load. As you know, browser download files will pop up dialog window to choose the location, I do not except this step.
I use promise.all to wait all files download, then should I use which itk api to change to itk image?

Thanks very much!

You can use the fetch API or XMLHTTPRequest to download your datasets from your remote server, which should yield an array of File objects. That can then be passed into readImageDICOMFileSeries, which will reconstruct your volume.

Hi Forrest,

Thanks your suggestion.
I have tryed readImageDICOMFileSeries, this method will requset http://192.168.0.109:8080/itk/WebWorkers/ImageIO.worker.js, but server not exist this file.

following is code snippet:

const testSeriesDirectory = 'http://192.168.0.109/images/'
      const fileNames = ['IM-0001-0001.dcm', 'IM-0001-0002.dcm', 'IM-0001-0003.dcm']
      const fetchFiles = fileNames.map(function (file) {
        const path = testSeriesDirectory + file;
        const axiosget = axios.get(path, { responseType: 'blob' }).catch(error => {console.log('axios get error');  console.log(error)});
        return axiosget.then(function (response) {
          const jsFile = new window.File([response.data], file)
          return jsFile
        })
        .catch(error => {console.log('axios get then error');  console.log(error)})
      })


      const promissall = Promise.all(fetchFiles)
          .catch(error => {
            console.log(error)
          });

      const promissallthen = promissall.then(function (files) {
        return readImageDICOMFileSeries(null, files)
      }).catch(error => {console.log('promiss all then error'); console.log(error)});

      const promissallthenthen = promissallthen.then(function ({ image, webWorker }) {
        webWorker.terminate()
        console.log(image.imageType.dimension)
        this.imageDownloadCallback(vtkITKHelper.convertItkToVtkImage(image));
      })
    }

Many thanks!

Ah, in order to use itk.js you need to host the webworkers somewhere. If you are using webpack or some other build tool (or not), you need to copy node_modules/itk/ to the root of your public folder. That way you get the /itk/WebWorkers/... files.

I test on my computer, I use nginx to proxy the images and itk folder.
e.g.
http://ip:8080/myapp request http://ip/images or http://ip/itk/WebWorkers/ImageIO.worker.js
Now I can request the ImageIO.worker.js, but I got error:


other info:
npm install itk@9.6.1

Should I use itk in umd mode?
Should I do some process after download images?
I really appreciate your patience, thank you!

Can you share the snippet of code that you use for loading images into itk.js? Unless there is a bug in itk.js (which I don’t think there is for reading files), I think this might be how you are loading files into itk.js.

Please refer to the reply few days ago.

What version of itk.js are you using? The latest version of itk.js drops the webWorker first arg IIRC, so you should just call readImageDICOMFileSeries(files).

I use itk 9.6.1, I will try the latest itk version


I use the latest itk, throws same error.
Command: npm install itk

I’m pretty sure that error occurs because itk.js does not see those files as dicom files. Assuming that they are actually dicom files (I am assuming they load up just fine in 3D Slicer or ParaView Glance), can you verify that your web server is serving the dicom files correctly? At the very least, check that files.map((file) => console.log(file.name, file.size)); prints out file sizes that you expect.

Hi Forrest,
I think I know the reason, when I load entire series images, no error throws. I use part of series image for test before.
Is there read signal dicom file method in itk, I want to get some headers info.

Thank you very much!

Glad to know that you figured out the issue!

I assume you mean reading dicom tags/headers? Right now itk.js does not expose any official means of reading dicom tags, but we are working on it. (FYI @thewtex) However, it is possible with some custom C++ cross-compiled to webassembly, thought it is a lot more difficult to set up. Check out https://github.com/InsightSoftwareConsortium/itk-js/pull/252 for a discussion of dicom tag/header reading.

Thank you for your suggestions, I will focus on it.