VTK Examples - WASM and CI/CD

Announcements
1

The VTK examples have had a significant upgrade:

  • WASM has been introduced for the C++ examples. This means that we have a live preview feature in WebAssembly for lots of the C++ examples.
  • CI/CD (continuous integration and continuous delivery/deployment) is now running for the C++ examples

WASM

For a complex example that loads lots of data from different files, please have a look at PBR_Skybox_Texturing. Feel free to manipulate the image using the sliders and also do rotate/zoom the image. At the bottom of the WASM window you will see all the data files that are loaded.

CI/CD

There is a nightly CI/CD run against the vtk/vtk-examples repository which builds and deploys the web site. This also provides an additional testing of the VTK Master against a broad range of examples. Updates will need to be made to the workflow to add the pipeline to Kitware US runners in order to make it work, please see https://gitlab.kitware.com/vtk/vtk-examples/-/issues/13 for more information.

Things to watch out for

Not all C++ examples will work with WASM, please see 2_NoWASMIntegration for a list of excluded examples and the reasons why they were excluded.

If you want to contribute an example, please look at 4_ContributingWASM. This is especially important if your example needs data. If your example doesn’t work with WASM then you will need to exclude it and provide a reason as outlined in 2_NoWASMIntegration.

Acknowledgements

All this work was undertaken by @astucky as part of his internship. The project was originally just to add WASM to the C++ examples.

However he went above and beyond by:

  • Writing and compartmentalizing all the WASM scripts. This resulted in minimal changes to the existing scripts
  • Clearly documenting reasons why a particular example will not work
  • Devising a neat way of ensuring that the WASM examples could access their data
  • Setting up CI/CD

We are all grateful for the massive amount of work that Adrien has done, and, to the guidance from @Jules_Bourdais and @ben.boeckel throughout the process. @jaswantp gets special mention for his great help with VTK-WASM, Adrien was really grateful for this help. Also for the sysadmins and others who made this all come together.

Teamwork across many disciplines, works every time!

10 Likes
2

This is spectacular !

2 Likes
3

Wow, just wow!!!

Remind me, do we have any examples that show how to use wasm blobs in VTK.js, or in trame? I’m not sure such examples belong in VTK proper, but it’d be nice to show VTK wasm being used by other applications / inside other frameworks.

1 Like
4

I know we have examples regarding using VTK.js with itk-wasm here: vtk.js and vtk.js
Regarding other examples related to VTK/trame, I don’t think we have examples but @Sebastien_Jourdain might be up to something with this.

5

We did integrate into trame an external vtk/wasm build. I also did a lighting talk show casing that at our team meeting.

Also we are working to use VTK-wasm to support properly local rendering with trame using the same current API (provide server side vtkRenderWindow+widgets so it can be mirrored and rendered client side).

1 Like