itk.js readImageDICOMFileSeries

hello,

I am developing an application in vue-js and im having issues with the readImageDICOMFileSeries method. I’m currently not using a web-worker and it keeps returning this error. “ImageIO.worker.js:1 Uncaught SyntaxError: Unexpected token <”. Here is the code for my component.

<template>
  <div>
    <v-btn @click="click">click!</v-btn>
    <input id="fileItem" type="file">
  </div>
</template>

<script>
import readImageDICOMFileSeries from "itk/readImageDICOMFileSeries";

export default {
  name: "Test",
  methods: {
click() {
  var file = document.getElementById("fileItem").files[0];
   readImageDICOMFileSeries(null, file)
    .then(function({ image, webWorker }) {
      console.log(image);
    })
    .catch(error => {
      console.error(error);
    });
}
  }
};
</script>

Hi Andrew,

As a first step, try to use the itk.js UMD module.

<script src="https://unpkg.com/itk@9.6.1/umd/itk.js"></script>

<script>
export default {
  name: "Test",
  methods: {
click() {
  var file = document.getElementById("fileItem").files[0];
   itk.readImageFile(null, file)
    .then(function({ image, webWorker }) {
      console.log(image);
    })
    .catch(error => {
      console.error(error);
    });
}
  }
};
</script>

For an interactive example, see

Note that for a single file, use the readImageFile API.

To support both a single-file DICOM volume and a DICOM series, see this example:

Eventually, you may want to incorporate itk.js into your Webpack build. An overview and example of this is here:

You can also use the Unpkg.com-published web workers with Webpack:

1 Like