docs(examplegallery): further improve the image gallery and examples

Reference HttpDataSetReader, HttpDataSetSeriesReader, HttpSceneLoader,
OfflineLocalView, ImageStream and RemoteView in the gallery.
Improve their documentation as well.

issue #2973

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
 
 <div class="gallery">
 
-[![PDBReader Example][PDBReader]](./PDBReader.html "PDBReader Example")
-[![ElevationReader Example][ElevationReader]](./ElevationReader.html)
 [![VolumeContour Example][VolumeContour]](./VolumeContour.html)
 [![MultiSliceImageMapper Example][MultiSliceImageMapper]](./MultiSliceImageMapper.html)
 [![PiecewiseGaussianWidget Example][PiecewiseGaussianWidget]](./PiecewiseGaussianWidget.html)
-[![ZipHttpReader Example][ZipHttpReader]](./ZipHttpReader.html)
 
 </div>
 
-[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
 
 <div class="gallery">
 
-[![DracoReader Example][DracoReader]](./DracoReader.html "Draco reader(drc)")
-[![PLYReader Example][PLYReader]](./PLYReader.html "PLY reader(ply)")
-[![PLYWriter Example][PLYWriter]](./PLYWriter.html "PLY writer(ply)")
-[![STLReader Example][STLReader]](./STLReader.html "STL reader(stl)")
-[![STLWriter Example][STLWriter]](./STLWriter.html "STL writer(stl)")
-[![PolyDataReader Example][PolyDataReader]](./PolyDataReader.html "VTK legacy reader(VTK)")
-[![ElevationReader Example][ElevationReader]](./ElevationReader.html "Elevation reader(CSV, JPG)")
+[![DracoReader Example][DracoReaderWithIcon]](./DracoReader.html "Draco reader(drc)")
+[![PLYReader Example][PLYReaderWithIcon]](./PLYReader.html "PLY reader(ply)")
+[![PLYWriter Example][PLYWriterWithIcon]](./PLYWriter.html "PLY writer(ply)")
+[![STLReader Example][STLReaderWithIcon]](./STLReader.html "STL reader(stl)")
+[![STLWriter Example][STLWriterWithIcon]](./STLWriter.html "STL writer(stl)")
+[![PolyDataReader Example][PolyDataReaderWithIcon]](./PolyDataReader.html "VTK legacy reader(VTK)")
+[![ElevationReader Example][ElevationReaderWithIcon]](./ElevationReader.html "Elevation reader(CSV, JPG)")
 [![OBJReader Example][OBJReaderWithIcon]](./OBJReader.html "OBJ reader(OBJ, MTL, JPG)")
 [![PDBReader Example][PDBReaderWithIcon]](./PDBReader.html "PDB reader(OBJ, MTL, JPG)")
-[![XMLImageDataWriter Example][XMLImageDataWriter]](./XMLImageDataWriter.html "ImageData XML writer(VTI)")
-[![XMLPolyDataDataWriter Example][XMLPolyDataWriter]](./XMLPolyDataWriter.html "PolyData XML writer(VTP)")
+[![XMLImageDataWriter Example][XMLImageDataWriterWithIcon]](./XMLImageDataWriter.html "ImageData XML writer(VTI)")
+[![XMLPolyDataDataWriter Example][XMLPolyDataWriterWithIcon]](./XMLPolyDataWriter.html "PolyData XML writer(VTP)")
 [![ZipHttpReader Example][ZipHttpReaderWithIcon]](./ZipHttpReader.html "ZIP http reader(ZIP)")
+[![HttpDataSetReader Example][HttpDataSetReaderWithIcon]](./HttpDataSetReader.html "Import a VTK dataset")
+[![HttpDataSetSeriesReader Example][HttpDataSetSeriesReaderWithIcon]](./HttpDataSetSeriesReader.html "Import a VTK dataset with time support.")
+[![HttpSceneLoader Example][HttpSceneLoaderWithIcon]](./HttpSceneLoader.html "Import a VTK scene (data + representation)")
+[![OfflineLocalView Example][OfflineLocalViewWithIcon]](./OfflineLocalView.html "Load a serialized scene (VTKSZ)")
 
 </div>
 
-[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")
 
-
 </div>
 
 [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")
 
+</div>
+
 [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
+[SplineWidget]: ../docs/gallery/SplineWidget.gif
+
+## Connectivity
+
+<div class="gallery">
+
+[![RemoteView Example][RemoteViewWithLogos]](./RemoteView.html "Connect a VTK or ParaView Python backend server via WebSockets")
+[![ImageStream Example][ImageStreamWithLogos]](./ImageStream.html "Stream a ParaView Python backend server via WebSockets under a VTK.js rendering")
+
+
+</div>
+
+[RemoteViewWithLogos]: ../docs/gallery/RemoteViewWithLogos.jpg
+[ImageStreamWithLogos]: ../docs/gallery/ImageStreamWithLogos.jpg

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)

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);

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
 

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
 // ----------------------------------------------------------------------------

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.

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
 ```
 

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)
+

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
 ```
+