search

Kitware / itk-vtk-viewer

2D / 3D web image, mesh, and point set viewer using itk-wasm and vtk.js
https://kitware.github.io/itk-vtk-viewer/
BSD 3-Clause "New" or "Revised" License
210 stars 64 forks source link

Expose itk.js functions for the CDN version #222

Closed oeway closed 4 years ago

oeway commented 4 years ago

I am wondering that whether we can expose all the vtk.js api functions (along with other apis) to be available from the viewer.

For example, for a recent ImJoy plugin I made, I had to modify index.js and build my own viewer file, in order to access to an ITK function vtkITKHelper.convertItkToVtkImage.

Would be nice if we have a way to expose all these helper functions, although I don't know what's the best way to do it.

thewtex commented 4 years ago

For example, for a recent ImJoy plugin I made

Woah, cool! :sunglasses:

In cases like this, e can use the itkVtkViewerCDN for a viewer interface but also make additional calls to itk.js and vtk.js. Both itk.js and vtk.js have exported APIs that can be called from their CDN distributions. However, we have to import scripts with, e.g.

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

Here are examples:

https://glitch.com/~itk-js-umd-example https://kitware.github.io/vtk-js/docs/intro_vtk_as_external_script.html

Interested to know if this works for you.

oeway commented 4 years ago

I see, I can add these two files, but if I also add a third file for itk-vtk-viewer, will I have two copies of itk and vtk? Potentially in different versions as the one used in itk-vtk-viewer? Or it won’t be an issue because webpack didn’t include those parts not used?

oeway commented 4 years ago

BTW, adding the two files for vtk and itk works.

thewtex commented 4 years ago

In general, it should be fine to include them separately, but it is a good idea to use the same versions of itk.js and vtk.js as found in itk-vtk-viewer/package.json so the data structures and API are compatible.

BTW, adding the two files for vtk and itk works.

Awesome!

Demo here for other folk's reference: https://gist.github.com/thewtex/b6f7572d648ccd31af4d7d1972463ac1#file-scifio-itk-vtk-viewer-imjoy-html

  "requirements": [
    "https://unpkg.io/itk-vtk-viewer@9.11.1/dist/itkVtkViewerCDN.js",
    "https://unpkg.com/vtk.js@13.0.0"
  ],

[...]

let imageData = vtk.Common.DataModel.vtkITKHelper.convertItkToVtkImage({