diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md index a4228b20f8a..932270e9aab 100644 --- a/.github/pull_request_template.md +++ b/.github/pull_request_template.md @@ -1,56 +1,56 @@ - - -### Context - - -### Results - - -### Changes - -- [ ] Documentation and TypeScript definitions were updated to match those changes - -### PR and Code Checklist - -- [ ] [semantic-release](https://github.com/semantic-release/semantic-release) commit messages -- [ ] Run `npm run reformat` to have correctly formatted code - -### Testing - -- [ ] This change adds or fixes unit tests -- [ ] Tested environment: - - **vtk.js**: - - **OS**: - - **Browser**: - - + + +### Context + + +### Results + + +### Changes + +- [ ] Documentation and TypeScript definitions were updated to match those changes + +### PR and Code Checklist + +- [ ] [semantic-release](https://github.com/semantic-release/semantic-release) commit messages +- [ ] Run `npm run reformat` to have correctly formatted code + +### Testing + +- [ ] This change adds or fixes unit tests +- [ ] Tested environment: + - **vtk.js**: + - **OS**: + - **Browser**: + + diff --git a/Documentation/content/docs/gallery/HttpDataSetReaderWithIcon.jpg b/Documentation/content/docs/gallery/HttpDataSetReaderWithIcon.jpg new file mode 100644 index 00000000000..e0c6ca48ed0 Binary files /dev/null and b/Documentation/content/docs/gallery/HttpDataSetReaderWithIcon.jpg differ diff --git a/Documentation/content/docs/gallery/HttpDataSetSeriesReaderWithIcon.gif b/Documentation/content/docs/gallery/HttpDataSetSeriesReaderWithIcon.gif new file mode 100644 index 00000000000..86101434baf Binary files /dev/null and b/Documentation/content/docs/gallery/HttpDataSetSeriesReaderWithIcon.gif differ diff --git a/Documentation/content/docs/gallery/HttpSceneLoaderWithIcon.jpg b/Documentation/content/docs/gallery/HttpSceneLoaderWithIcon.jpg new file mode 100644 index 00000000000..fd0233b61d4 Binary files /dev/null and b/Documentation/content/docs/gallery/HttpSceneLoaderWithIcon.jpg differ diff --git a/Documentation/content/docs/gallery/ImageStreamWithLogos.jpg b/Documentation/content/docs/gallery/ImageStreamWithLogos.jpg new file mode 100644 index 00000000000..e7746cec2ca Binary files /dev/null and b/Documentation/content/docs/gallery/ImageStreamWithLogos.jpg differ diff --git a/Documentation/content/docs/gallery/OfflineLocalViewWithIcon.jpg b/Documentation/content/docs/gallery/OfflineLocalViewWithIcon.jpg new file mode 100644 index 00000000000..7edf243f6c7 Binary files /dev/null and b/Documentation/content/docs/gallery/OfflineLocalViewWithIcon.jpg differ diff --git a/Documentation/content/docs/gallery/RemoteViewWithLogos.jpg b/Documentation/content/docs/gallery/RemoteViewWithLogos.jpg new file mode 100644 index 00000000000..3e55ec3458a Binary files /dev/null and b/Documentation/content/docs/gallery/RemoteViewWithLogos.jpg differ diff --git a/Documentation/content/docs/gallery/ResliceCursorWidget.gif b/Documentation/content/docs/gallery/ResliceCursorWidget.gif new file mode 100644 index 00000000000..079b01f56d2 Binary files /dev/null and b/Documentation/content/docs/gallery/ResliceCursorWidget.gif differ diff --git a/Documentation/content/examples/index.md b/Documentation/content/examples/index.md index 2b42b215aec..cb80e840f5b 100644 --- a/Documentation/content/examples/index.md +++ b/Documentation/content/examples/index.md @@ -36,21 +36,15 @@ This will allow you to see the some live code running in your browser. Just pick -[ElevationReader]: ../docs/gallery/ElevationReader.jpg [MultiSliceImageMapper]: ../docs/gallery/MultiSliceImageMapper.jpg -[PDBReader]: ../docs/gallery/PDBReader.jpg [PiecewiseGaussianWidget]: ../docs/gallery/PiecewiseGaussianWidget.jpg [VolumeContour]: ../docs/gallery/VolumeContour.jpg -[ZipHttpReader]: ../docs/gallery/ZipHttpReader.jpg ## Applications @@ -100,33 +94,41 @@ This will allow you to see the some live code running in your browser. Just pick -[DracoReader]: ../docs/gallery/DracoReaderWithIcon.jpg -[PLYReader]: ../docs/gallery/PLYReaderWithIcon.jpg -[PLYWriter]: ../docs/gallery/PLYWriterWithIcon.jpg -[STLReader]: ../docs/gallery/STLReaderWithIcon.jpg -[STLWriter]: ../docs/gallery/STLWriterWithIcon.jpg -[PolyDataReader]: ../docs/gallery/VTKReaderWithIcon.jpg -[ElevationReader]: ../docs/gallery/ElevationReaderWithIcon.jpg +[DracoReaderWithIcon]: ../docs/gallery/DracoReaderWithIcon.jpg +[PLYReaderWithIcon]: ../docs/gallery/PLYReaderWithIcon.jpg +[PLYWriterWithIcon]: ../docs/gallery/PLYWriterWithIcon.jpg +[STLReaderWithIcon]: ../docs/gallery/STLReaderWithIcon.jpg +[STLWriterWithIcon]: ../docs/gallery/STLWriterWithIcon.jpg +[PolyDataReaderWithIcon]: ../docs/gallery/VTKReaderWithIcon.jpg +[ElevationReaderWithIcon]: ../docs/gallery/ElevationReaderWithIcon.jpg [OBJReaderWithIcon]: ../docs/gallery/OBJReaderWithIcon.jpg [PDBReaderWithIcon]: ../docs/gallery/PDBReaderWithIcon.jpg -[XMLImageDataWriter]: ../docs/gallery/XMLImageDataWriterWithIcon.jpg -[XMLPolyDataWriter]: ../docs/gallery/XMLPolyDataWriterWithIcon.jpg +[XMLImageDataWriterWithIcon]: ../docs/gallery/XMLImageDataWriterWithIcon.jpg +[XMLPolyDataWriterWithIcon]: ../docs/gallery/XMLPolyDataWriterWithIcon.jpg [ZipHttpReaderWithIcon]: ../docs/gallery/ZipHttpReaderWithIcon.jpg +[HttpDataSetReaderWithIcon]: ../docs/gallery/HttpDataSetReaderWithIcon.jpg +[HttpDataSetSeriesReaderWithIcon]: ../docs/gallery/HttpDataSetSeriesReaderWithIcon.gif +[HttpSceneLoaderWithIcon]: ../docs/gallery/HttpSceneLoaderWithIcon.jpg +[OfflineLocalViewWithIcon]: ../docs/gallery/OfflineLocalViewWithIcon.jpg ## Rendering @@ -142,7 +144,6 @@ This will allow you to see the some live code running in your browser. Just pick [![VolumeMapper Example][VolumeMapper]](./VolumeMapper.html "3D volume ray cast mapper witch volumetric scattering") [![SurfaceLICMapper Example][SurfaceLICMapper]](./SurfaceLICMapper.html "Surface Line Integral Convolution (LIC) mapper") - [Glyph3DMapper]: ../docs/gallery/Glyph3DMapper.jpg @@ -163,6 +164,8 @@ This will allow you to see the some live code running in your browser. Just pick [![PointPicker Example][PointPicker]](./PointPicker.html "CPU point picker/selector") [![HardwareSelector Example][HardwareSelector]](./HardwareSelector.html "GPU point/cell picker/selector with properties") + + [CellPicker]: ../docs/gallery/CellPicker.jpg [PointPicker]: ../docs/gallery/PointPicker.jpg [HardwareSelector]: ../docs/gallery/HardwareSelector.jpg @@ -194,7 +197,20 @@ This will allow you to see the some live code running in your browser. Just pick [LineWidget]: ../docs/gallery/LineWidget.png [PaintWidget]: ../docs/gallery/PaintWidget.gif [PolyLineWidget]: ../docs/gallery/PolyLineWidget.png -[ResliceCursorWidget]: ../docs/gallery/ResliceCursorWidget.jpg +[ResliceCursorWidget]: ../docs/gallery/ResliceCursorWidget.gif [ShapeWidget]: ../docs/gallery/ShapeWidget.png [SphereWidget]: ../docs/gallery/SphereWidget.jpg -[SplineWidget]: ../docs/gallery/SplineWidget.gif \ No newline at end of file +[SplineWidget]: ../docs/gallery/SplineWidget.gif + +## Connectivity + + + +[RemoteViewWithLogos]: ../docs/gallery/RemoteViewWithLogos.jpg +[ImageStreamWithLogos]: ../docs/gallery/ImageStreamWithLogos.jpg diff --git a/Examples/Applications/OfflineLocalView/index.md b/Examples/Applications/OfflineLocalView/index.md new file mode 100644 index 00000000000..7cd0b5806fb --- /dev/null +++ b/Examples/Applications/OfflineLocalView/index.md @@ -0,0 +1,10 @@ +# Offline Local View + +It uses a static export of the dynamic synchronizable view of vtk.js which get used within trame for its local view. + +This is notably use by [trame](https://trame.kitware.com/) and [PyVista](https://docs.pyvista.org/) + +You can download PyVista example files: +* [Maps and Terrains](https://docs.pyvista.org/version/stable/_images/examples/00-load/images/sphx_glr_terrain_mesh.vtksz) +* [Finite Element Analysis](https://docs.pyvista.org/version/stable/_images/plot_directive/index-3_00_00.vtksz) +* [Point Cloud](https://docs.pyvista.org/version/stable/_images/plot_directive/index-4_00_00.vtksz) \ No newline at end of file diff --git a/Examples/Geometry/CubeAxes/index.js b/Examples/Geometry/CubeAxes/index.js index 588963f9a9f..b960be8d8a7 100644 --- a/Examples/Geometry/CubeAxes/index.js +++ b/Examples/Geometry/CubeAxes/index.js @@ -6,26 +6,18 @@ import '@kitware/vtk.js/Rendering/Profiles/Geometry'; import vtkActor from '@kitware/vtk.js/Rendering/Core/Actor'; import vtkCubeAxesActor from '@kitware/vtk.js/Rendering/Core/CubeAxesActor'; import vtkConeSource from '@kitware/vtk.js/Filters/Sources/ConeSource'; -import vtkInteractorStyleTrackballCamera from '@kitware/vtk.js/Interaction/Style/InteractorStyleTrackballCamera'; import vtkMapper from '@kitware/vtk.js/Rendering/Core/Mapper'; -import vtkRenderWindow from '@kitware/vtk.js/Rendering/Core/RenderWindow'; -import vtkRenderWindowInteractor from '@kitware/vtk.js/Rendering/Core/RenderWindowInteractor'; -import vtkRenderer from '@kitware/vtk.js/Rendering/Core/Renderer'; -import vtkURLExtract from '@kitware/vtk.js/Common/Core/URLExtract'; - -import '@kitware/vtk.js/Rendering/OpenGL/RenderWindow'; -import '@kitware/vtk.js/Rendering/WebGPU/RenderWindow'; - -// Process arguments from URL -const userParams = vtkURLExtract.extractURLParameters(); +import vtkFullScreenRenderWindow from '@kitware/vtk.js/Rendering/Misc/FullScreenRenderWindow'; // ---------------------------------------------------------------------------- // Standard rendering code setup // ---------------------------------------------------------------------------- -const renderWindow = vtkRenderWindow.newInstance(); -const renderer = vtkRenderer.newInstance({ background: [0.2, 0.3, 0.4] }); -renderWindow.addRenderer(renderer); +const fullScreenRenderer = vtkFullScreenRenderWindow.newInstance({ + background: [0.2, 0.3, 0.4], +}); +const renderer = fullScreenRenderer.getRenderer(); +const renderWindow = fullScreenRenderer.getRenderWindow(); // ---------------------------------------------------------------------------- // Simple pipeline ConeSource --> Mapper --> Actor @@ -44,51 +36,14 @@ actor.setMapper(mapper); // ---------------------------------------------------------------------------- renderer.addActor(actor); -renderer.resetCamera(); const cubeAxes = vtkCubeAxesActor.newInstance(); cubeAxes.setCamera(renderer.getActiveCamera()); cubeAxes.setDataBounds(actor.getBounds()); renderer.addActor(cubeAxes); -// ---------------------------------------------------------------------------- -// Use OpenGL as the backend to view the all this -// ---------------------------------------------------------------------------- - -const apiSpecificRenderWindow = renderWindow.newAPISpecificView( - userParams.viewAPI -); -renderWindow.addView(apiSpecificRenderWindow); - -// ---------------------------------------------------------------------------- -// Create a div section to put this into -// ---------------------------------------------------------------------------- - -const container = document.createElement('div'); -document.querySelector('body').appendChild(container); -apiSpecificRenderWindow.setContainer(container); - -// ---------------------------------------------------------------------------- -// Capture size of the container and set it to the renderWindow -// ---------------------------------------------------------------------------- - -const { width, height } = container.getBoundingClientRect(); -apiSpecificRenderWindow.setSize(width, height); - -// ---------------------------------------------------------------------------- -// Setup an interactor to handle mouse events -// ---------------------------------------------------------------------------- - -const interactor = vtkRenderWindowInteractor.newInstance(); -interactor.setView(apiSpecificRenderWindow); -interactor.initialize(); -interactor.bindEvents(container); - -// ---------------------------------------------------------------------------- -// Setup interactor style to use -// ---------------------------------------------------------------------------- - -interactor.setInteractorStyle(vtkInteractorStyleTrackballCamera.newInstance()); +renderer.resetCamera(); +renderWindow.render(); // make the cubeAxes global visibility in case you want to try changing // some values diff --git a/Examples/Geometry/SimpleCone/index.js b/Examples/Geometry/SimpleCone/index.js index bc40834c577..c506de9b8e6 100644 --- a/Examples/Geometry/SimpleCone/index.js +++ b/Examples/Geometry/SimpleCone/index.js @@ -6,19 +6,16 @@ import '@kitware/vtk.js/Rendering/Profiles/Geometry'; import vtkActor from '@kitware/vtk.js/Rendering/Core/Actor'; import vtkConeSource from '@kitware/vtk.js/Filters/Sources/ConeSource'; import vtkMapper from '@kitware/vtk.js/Rendering/Core/Mapper'; -import vtkOpenGLRenderWindow from '@kitware/vtk.js/Rendering/OpenGL/RenderWindow'; -import vtkRenderWindow from '@kitware/vtk.js/Rendering/Core/RenderWindow'; -import vtkRenderWindowInteractor from '@kitware/vtk.js/Rendering/Core/RenderWindowInteractor'; -import vtkRenderer from '@kitware/vtk.js/Rendering/Core/Renderer'; -import vtkInteractorStyleTrackballCamera from '@kitware/vtk.js/Interaction/Style/InteractorStyleTrackballCamera'; +import vtkFullScreenRenderWindow from '@kitware/vtk.js/Rendering/Misc/FullScreenRenderWindow'; // ---------------------------------------------------------------------------- // Standard rendering code setup // ---------------------------------------------------------------------------- -const renderWindow = vtkRenderWindow.newInstance(); -const renderer = vtkRenderer.newInstance({ background: [0.2, 0.3, 0.4] }); -renderWindow.addRenderer(renderer); +const renderWindow = vtkFullScreenRenderWindow.newInstance({ + background: [0.2, 0.3, 0.4], +}); +const renderer = renderWindow.getRenderer(); // ---------------------------------------------------------------------------- // Simple pipeline ConeSource --> Mapper --> Actor @@ -38,40 +35,3 @@ actor.setMapper(mapper); renderer.addActor(actor); renderer.resetCamera(); - -// ---------------------------------------------------------------------------- -// Use OpenGL as the backend to view the all this -// ---------------------------------------------------------------------------- - -const openGLRenderWindow = vtkOpenGLRenderWindow.newInstance(); -renderWindow.addView(openGLRenderWindow); - -// ---------------------------------------------------------------------------- -// Create a div section to put this into -// ---------------------------------------------------------------------------- - -const container = document.createElement('div'); -document.querySelector('body').appendChild(container); -openGLRenderWindow.setContainer(container); - -// ---------------------------------------------------------------------------- -// Capture size of the container and set it to the renderWindow -// ---------------------------------------------------------------------------- - -const { width, height } = container.getBoundingClientRect(); -openGLRenderWindow.setSize(width, height); - -// ---------------------------------------------------------------------------- -// Setup an interactor to handle mouse events -// ---------------------------------------------------------------------------- - -const interactor = vtkRenderWindowInteractor.newInstance(); -interactor.setView(openGLRenderWindow); -interactor.initialize(); -interactor.bindEvents(container); - -// ---------------------------------------------------------------------------- -// Setup interactor style to use -// ---------------------------------------------------------------------------- - -interactor.setInteractorStyle(vtkInteractorStyleTrackballCamera.newInstance()); diff --git a/Sources/IO/Core/HttpDataSetReader/example/index.md b/Sources/IO/Core/HttpDataSetReader/example/index.md index df8175bd4cd..b8eb7aa9b02 100644 --- a/Sources/IO/Core/HttpDataSetReader/example/index.md +++ b/Sources/IO/Core/HttpDataSetReader/example/index.md @@ -1 +1,2 @@ + __Caution__: The example is not actually loading a vtp file but a data structrure that was coming from a vtp file. For more details please read the [vtkHttpDataSetReader API](../api/IO_Core_HttpDataSetReader.html); diff --git a/Sources/IO/Core/HttpDataSetSeriesReader/api.md b/Sources/IO/Core/HttpDataSetSeriesReader/api.md index caed60c3d12..b936a6e3004 100644 --- a/Sources/IO/Core/HttpDataSetSeriesReader/api.md +++ b/Sources/IO/Core/HttpDataSetSeriesReader/api.md @@ -1,4 +1,4 @@ -The vtkHttpDataSetSeriesReader object is a reader which can load datasets that can vary over time. It is a wrapper over multiple [httpDataSetReader](IO_Core_HttpDataSetReader.html). +The vtkHttpDataSetSeriesReader object is a reader which can load datasets that can vary over time. It is a wrapper over multiple [HttpDataSetReader](IO_Core_HttpDataSetReader.html). ## Usage diff --git a/Sources/IO/Core/HttpDataSetSeriesReader/example/index.js b/Sources/IO/Core/HttpDataSetSeriesReader/example/index.js index d011c3cc5f0..ce31fecef2d 100644 --- a/Sources/IO/Core/HttpDataSetSeriesReader/example/index.js +++ b/Sources/IO/Core/HttpDataSetSeriesReader/example/index.js @@ -23,6 +23,9 @@ const fullScreenRenderer = vtkFullScreenRenderWindow.newInstance(); const renderer = fullScreenRenderer.getRenderer(); const renderWindow = fullScreenRenderer.getRenderWindow(); +renderer.getActiveCamera().setPosition(6, 3, 7); +renderer.getActiveCamera().setFocalPoint(0, 2, 0); + // ---------------------------------------------------------------------------- // Example code // ---------------------------------------------------------------------------- diff --git a/Sources/IO/Core/HttpSceneLoader/example/index.md b/Sources/IO/Core/HttpSceneLoader/example/index.md new file mode 100644 index 00000000000..cb29dd9687f --- /dev/null +++ b/Sources/IO/Core/HttpSceneLoader/example/index.md @@ -0,0 +1,3 @@ +# Scene loader + +Imports VTK [scenes](https://github.com/Kitware/vtk-js/tree/master/Data/scene) generated by VTK (or ParaView) using vtkJSONSceneExporter. The exporter in VTK/ParaView leverages that format to capture the geometry/volume and its representation settings. diff --git a/Sources/IO/Core/ImageStream/example/index.md b/Sources/IO/Core/ImageStream/example/index.md index bd212d42c52..2f2dc620983 100644 --- a/Sources/IO/Core/ImageStream/example/index.md +++ b/Sources/IO/Core/ImageStream/example/index.md @@ -1,8 +1,8 @@ This example aims to provide an example on how to configure a vtk.js RenderWindow to support remote rendering via a ParaView over WebSocket using WSLink while still having local 3D overlay. -In order to run the server, you will need a ParaView (5.6+) binary and run the following command line where the Python file provided as argument is available [here](https://github.com/Kitware/vtk-js/blob/master/Sources/IO/Core/ImageStream/example/pvw-server.py) +In order to run the server, you will need a [ParaView (5.6+) binary](https://www.paraview.org/download/) and run the following command line where the Python file provided as argument is available [here](https://github.com/Kitware/vtk-js/blob/master/Sources/IO/Core/ImageStream/example/pvw-server.py) -``` +```sh /.../pvpython ./pvw-server.py --port 1234 ``` diff --git a/Sources/IO/Geometry/PLYReader/example/index.md b/Sources/IO/Geometry/PLYReader/example/index.md new file mode 100644 index 00000000000..f99da03e41a --- /dev/null +++ b/Sources/IO/Geometry/PLYReader/example/index.md @@ -0,0 +1,6 @@ + +You can find PLY files to download on [data.kitware.com](https://data.kitware.com/#folder/5afd92b48d777f15ebe1aac1): + - [Armadillo.ply](https://data.kitware.com/api/v1/file/5afd92e18d777f15ebe1ad73/download) + - [Bunny.ply](https://data.kitware.com/api/v1/file/5afd93678d777f15ebe1b47b/download) + - [PointCloud.ply](https://data.kitware.com/api/v1/file/5afd93368d777f15ebe1b1fb/download) + \ No newline at end of file diff --git a/Sources/Rendering/Misc/RemoteView/example/index.md b/Sources/Rendering/Misc/RemoteView/example/index.md index 772ebfa01fc..d49426c4df1 100644 --- a/Sources/Rendering/Misc/RemoteView/example/index.md +++ b/Sources/Rendering/Misc/RemoteView/example/index.md @@ -198,8 +198,9 @@ if __name__ == "__main__": ``` -And run it via the following command line: +In order to run the server, you will need a [ParaView (5.6+) binary](https://www.paraview.org/download/) and run the following command line where the Python file provided as argument is available [here](https://github.com/Kitware/vtk-js/blob/master/Sources/Rendering/Misc/RemoteView/example/pv-server.py) ```sh -pvpython pv_server.py --port 1234 +/.../pvpython ./pv-server.py --port 1234 ``` +