How to read nifti nii.gz file using VTK.js?

Web
, ,
4

Yes. I’m using a Vite dev server through an Electron interface. The Content Security Policy (CSP) is set up in both the index.html file and the electron.vite.config.ts file.

// index.html

    <meta
      http-equiv="Content-Security-Policy"
      content="default-src 'self'; script-src 'self' blob:; worker-src blob:; style-src 'self' 'unsafe-inline'; img-src 'self' blob: data:"
    />

// electron.vite.config.ts

    server: {
      headers: {
        'Content-Security-Policy':
          "default-src 'self'; script-src 'self' blob:; worker-src blob:; style-src 'self' 'unsafe-inline'; img-src 'self' blob: data:"
      }
    }

I’ve confirmed that the arrayBuffer is successfully passed from the backend to the frontend through the Electron interface. Here’s the code that handles the file reading and processing:

// VtkRenderer.vue

      window.electronAPI.readFile().then(async (arrayBuffer) => {
        console.log(arrayBuffer)
        const niftiReader = vtkITKImageReader.newInstance()
        niftiReader.setFileName('1.image.nii.gz')
        niftiReader
          .parseAsArrayBuffer(arrayBuffer)
          .then(() => {
            const data = niftiReader.getOutputData(0)
            const dataRange = data.getPointData().getScalars().getRange()
            const extent = data.getExtent()

            this.setupImageMappers(data)
            this.updateColorRange(dataRange)
            this.updateExtents(extent)

            this.renderer.resetCamera()
            this.renderer.resetCameraClippingRange()
            this.renderWindow.render()
          })
          .catch((error) => {
            console.log('error:', error)
          })
      })
    },