From e92a566ffe5269dbbc8c63fac35b8d33dc8cd45a Mon Sep 17 00:00:00 2001 From: Corentin MUNOZ Date: Mon, 1 Jun 2026 10:50:29 +0200 Subject: [PATCH 1/2] docs(widgets): add trame-flow --- docs/vitepress/guide/intro/widgets.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/vitepress/guide/intro/widgets.md b/docs/vitepress/guide/intro/widgets.md index 39e62462..b13c59b4 100644 --- a/docs/vitepress/guide/intro/widgets.md +++ b/docs/vitepress/guide/intro/widgets.md @@ -28,6 +28,7 @@ | **2D** | | | 👍 [annotations](https://github.com/Kitware/trame-annotations "Widgets for image and video annotations") | trame-annotations | 3 | 4 | | [bbox](https://github.com/Kitware/trame-bbox "Widget to draw and/or interact with bounding boxes") [🏗️](# "This component has been pushed to capture the current development state but is currently lacking funding to complete it.") | trame-bbox | 2 & 3 | 1 | +| | 🆕[flow](https://github.com/Kitware/trame-flow "VueFlow node editor") | trame-flow | 3 | 1 | | | 🆕👍 [image_tools](https://github.com/Kitware/trame-image-tools "Widgets to zoom/pan images with annotation overlay") | trame-image-tools | 3 | 6 | **3D** | | | [vtk, paraview](https://github.com/Kitware/trame-vtk "Interface with VTK and/or ParaView") | trame-vtk | 2 & 3 | 15 | From 3c41027fcbf61ba71c5efffe74e46219352d73f0 Mon Sep 17 00:00:00 2001 From: Corentin MUNOZ Date: Mon, 1 Jun 2026 11:25:14 +0200 Subject: [PATCH 2/2] docs: add trame-catalyst --- docs/vitepress/.vitepress/blogs.json | 4 + docs/vitepress/.vitepress/config.mjs | 1 + docs/vitepress/blogs/index.md | 69 +++++++++-------- ...our-web-browser-with-trame-and-catalyst.md | 77 +++++++++++++++++++ .../vitepress/examples/apps/trame-catalyst.md | 1 + 5 files changed, 118 insertions(+), 34 deletions(-) create mode 100644 docs/vitepress/blogs/monitor-your-simulation-in-your-web-browser-with-trame-and-catalyst.md create mode 100644 docs/vitepress/examples/apps/trame-catalyst.md diff --git a/docs/vitepress/.vitepress/blogs.json b/docs/vitepress/.vitepress/blogs.json index 2165f32b..232b921d 100644 --- a/docs/vitepress/.vitepress/blogs.json +++ b/docs/vitepress/.vitepress/blogs.json @@ -2,6 +2,10 @@ { "text": "2026", "items": [ + { + "text": "Monitor your Simulation in your Web Browser with trame and Catalyst", + "link": "/blogs/monitor-your-simulation-in-your-web-browser-with-trame-and-catalyst" + }, { "text": "trame-flow: Interactive flowcharts for your trame application", "link": "/blogs/trame-flow-interactive-flowcharts-for-your-trame-application" diff --git a/docs/vitepress/.vitepress/config.mjs b/docs/vitepress/.vitepress/config.mjs index 604007ff..dd1ff620 100644 --- a/docs/vitepress/.vitepress/config.mjs +++ b/docs/vitepress/.vitepress/config.mjs @@ -183,6 +183,7 @@ export default defineConfig({ // { text: 'PFB Viewer', link: 'https://github.com/Kitware/pfb-viewer' }, // { text: 'ParFlow Simulation Modeler', link: 'https://github.com/Kitware/pf-simulation-modeler' }, { text: "3D Slicer", link: "/examples/apps/trame-slicer" }, + { text: "Catalyst", link: "/examples/apps/trame-catalyst" }, { text: "Community", link: "/examples/apps/community" }, ], }, diff --git a/docs/vitepress/blogs/index.md b/docs/vitepress/blogs/index.md index ab58fdb3..bb8a1643 100644 --- a/docs/vitepress/blogs/index.md +++ b/docs/vitepress/blogs/index.md @@ -1,39 +1,40 @@ # Blogs
-
trame-flow: Interactive flowcharts for your trame application
-
Faster and better 3D Slicer rendering customization
-
A Framework for Next-Generation Visual Workflows in Scientific Computing
-
trame-slicer: Bringing the power of 3D Slicer to the web
-
Supercomputing Conference 2025
-
Bring Powerful 3D Visualization to the Browser with VTK.wasm
-
What’s New in trame: Bespoke Workflows for Better Productivity
-
Using Python to Power Scalable, Sustainable Innovation
-
How trame Powers Today’s Visualizations
-
Faster, simpler Python application execution with uv and trame
-
Medical Technology Trends to Watch in 2025
-
Why Medical Device Leaders Trust Kitware for Medical Image Innovations
-
JupyterLab Trame Manager at JĂĽlich Supercomputing Centre
-
A Year of Innovation: Our Most Impactful Projects and Technologies in 2024
-
LidarView 5.0 – new supported sensors, algorithms, and more!
-
VTK 9.4: A Step Closer to the Ways of Python
-
Simplify Web Application Development with trame
-
VTK.wasm and its trame integration
-
Making Modeling and Simulation Tools Accessible on the Web
-
trame: Micro-Workflow Use Case
-
trame: Dashboard Use Case
-
Exposing Web applications with ParaView 5.13 is getting simpler
-
Make Your Automotive Simulation Tools Available on the Web
-
trame: Architecture and Capabilities
-
Microscopy & Microanalysis
-
Lidar point cloud on the web with trame
-
Transform Your Medical Imaging with Kitware’s Comprehensive Suite of Advanced Visualization Solutions
-
Supercomputing 2023
-
trame: Revolutionizing Visual Analytics with Python
-
The Evolution of Peacock: A Powerful Interface for MOOSE Simulations
-
VERACore: trame in Application
-
Numerical plasma dynamics from the comfort of your web browser with trame
-
Leveraging MONAI for Medical AI
-
Scientific Visualization in 2022
+
Monitor your Simulation in your Web Browser with trame and Catalyst
+
trame-flow: Interactive flowcharts for your trame application
+
Faster and better 3D Slicer rendering customization
+
A Framework for Next-Generation Visual Workflows in Scientific Computing
+
trame-slicer: Bringing the power of 3D Slicer to the web
+
Supercomputing Conference 2025
+
Bring Powerful 3D Visualization to the Browser with VTK.wasm
+
What’s New in trame: Bespoke Workflows for Better Productivity
+
Using Python to Power Scalable, Sustainable Innovation
+
How trame Powers Today’s Visualizations
+
Faster, simpler Python application execution with uv and trame
+
Medical Technology Trends to Watch in 2025
+
Why Medical Device Leaders Trust Kitware for Medical Image Innovations
+
JupyterLab Trame Manager at JĂĽlich Supercomputing Centre
+
A Year of Innovation: Our Most Impactful Projects and Technologies in 2024
+
LidarView 5.0 – new supported sensors, algorithms, and more!
+
VTK 9.4: A Step Closer to the Ways of Python
+
Simplify Web Application Development with trame
+
VTK.wasm and its trame integration
+
Making Modeling and Simulation Tools Accessible on the Web
+
trame: Micro-Workflow Use Case
+
trame: Dashboard Use Case
+
Exposing Web applications with ParaView 5.13 is getting simpler
+
Make Your Automotive Simulation Tools Available on the Web
+
trame: Architecture and Capabilities
+
Microscopy & Microanalysis
+
Lidar point cloud on the web with trame
+
Transform Your Medical Imaging with Kitware’s Comprehensive Suite of Advanced Visualization Solutions
+
Supercomputing 2023
+
trame: Revolutionizing Visual Analytics with Python
+
The Evolution of Peacock: A Powerful Interface for MOOSE Simulations
+
VERACore: trame in Application
+
Numerical plasma dynamics from the comfort of your web browser with trame
+
Leveraging MONAI for Medical AI
+
Scientific Visualization in 2022
diff --git a/docs/vitepress/blogs/monitor-your-simulation-in-your-web-browser-with-trame-and-catalyst.md b/docs/vitepress/blogs/monitor-your-simulation-in-your-web-browser-with-trame-and-catalyst.md new file mode 100644 index 00000000..1d56343a --- /dev/null +++ b/docs/vitepress/blogs/monitor-your-simulation-in-your-web-browser-with-trame-and-catalyst.md @@ -0,0 +1,77 @@ +[post](https://www.kitware.com/monitor-your-simulation-in-your-web-browser-with-trame-and-catalyst/) + +# Monitor your Simulation in your Web Browser with trame and Catalyst + +May 29, 2026 + +[Corentin Munoz](https://www.kitware.com/author/corentin-munoz/ "Posts by Corentin Munoz") + +![trame-catalyst demo](https://www.kitware.com/main/wp-content/uploads/2026/05/image2.gif) + +Live visualizing simulation data can be difficult and costly: the data needs to be saved to disk periodically to be analyzed in order to create meaningful images. What if you wanted to monitor your simulation across multiple devices without installing anything locally? What if you wanted to do all of that without spending hours saving simulation data on the disk? Let’s see how it can be done using Kitware’s technologies. + +[Trame](https://kitware.github.io/trame/) is a Python framework for creating web applications with a few lines of code. A wide variety of trame widgets enables you to create rich interfaces. For instance, the trame-vtk module can be used to integrate ParaView using remote rendering. + +[Catalyst](https://catalyst-in-situ.readthedocs.io/en/latest/index.html) is an In-situ framework that allows you to perform analysis and visualization during a simulation, without suffering from any I/O bottleneck. Its main implementation, [ParaView-Catalyst](https://docs.paraview.org/en/latest/Catalyst/), lets developers visualize and analyze simulation data on every time step using ParaView’s rich collection of filters. You can learn more about ParaView-Catalyst in [this guide](https://kitware.github.io/paraview-catalyst/guide/concepts.html). + +![Using Catalyst, the analysis is done after each simulation step, without needing to save the whole simulation data on the disk. The analysis step can output data on the disk every time step, every n time steps, or based on a condition.](https://www.kitware.com/main/wp-content/uploads/2026/05/trame-catalyst-1.jpg) +

Using Catalyst, the analysis is done after each simulation step, without needing to save the whole simulation data on the disk. The analysis step can output data on the disk every time step, every n time steps, or based on a condition.

+ +Meet [trame-catalyst](https://gitlab.kitware.com/keu-public/trame-catalyst-demo), a trame application for live visualizing simulation data sent through Catalyst. It can be a good alternative to the ParaView Catalyst live client. In fact, it features a simpler interface, as you can only see the raw data. Since this is a web app, it doesn’t require any client-side installation (other than a web browser), and multiple people can view the results simultaneously. What’s more, it uses remote rendering, so you can easily monitor your simulation from any device, without needing a powerful GPU on each client. + +![With trame-catalyst, the client lives in the browser.](https://www.kitware.com/main/wp-content/uploads/2026/05/trame-catalyst-2.jpg) +

With trame-catalyst, the client lives in the browser.

+ +## Showcase + +This app features a full screen ParaView remote view where the simulation data can be shown. On the left, you can find some information about the simulation (connection status, current time step) and play/pause, connect/disconnect, and reset camera buttons. When connected to a simulation, the simulation channels are listed on the right side, with combo boxes to adjust the representation and the color array. + +Let’s try it out with two different simulations: + +The first simulation is a toy particle simulation that [you can find here](https://gitlab.kitware.com/keu-public/catalyst/simulator). Simply launch the trame-catalyst app, and then launch the simulation. The application will automatically pause the simulation when it connects. + + + +The second simulation is an example taken from the [ParaView Catalyst examples repository](https://gitlab.kitware.com/paraview/catalyst-examples/-/tree/master/ParaView/PythonImageData) and integrated into the trame-catalyst demo repository. + + + +## Try it yourself + +You can try trame-catalyst with your own simulation by downloading the app from [its repository](https://gitlab.kitware.com/keu-public/trame-catalyst-demo)! + +Launch the application using PVPython from a [ParaView release](https://www.paraview.org/download/): + +```shell +# Create venv +uv sync + +# Launch the application +/path/to/paraview/bin/pvpython --venv .venv src/trame_catalyst_demo/app/main.py +``` + +In parallel, you can launch any simulation that uses Catalyst. If you don’t have any, you can launch the example included in this repository. To run the simulation, you’ll need to build Catalyst with the `CATALYST_WRAP_PYTHON=ON` CMake option. + +```shell +# Download the extra python modules needed to run the simulation +uv sync --extra simulation + +# Setup environment variables for the simulation +export CATALYST_IMPLEMENTATION_PATHS=/path/to/paraview/lib/catalyst +export PYTHONPATH=/path/to/catalyst/lib/python3.14/site-packages/ + +# Launch the example simulation +uv run src/trame_catalyst_demo/example/fedriver.py src/trame_catalyst_demo/example/pipeline.py +``` + +The app will automatically pause the simulation when it is connected. You can unpause it using the play/pause button. + +## Conclusion + +Although this application can be used as-is, its main purpose is to demonstrate that visualizing simulation data live on the web is very easy with ParaView, Catalyst, and trame. + +Looking to take your application to new heights? [Contact our team](https://www.kitware.com/contact/) of experts for development and support services, and fast-track your success with trame. + +Tags: + +[Catalyst](https://www.kitware.com/tag/catalyst/) | [In Situ](https://www.kitware.com/tag/in-situ/) | [ParaView Catalyst](https://www.kitware.com/tag/paraview-catalyst/) | [Simulation Tools](https://www.kitware.com/tag/simulation-tools/) | [Trame](https://www.kitware.com/tag/trame/) | [Web Visualization](https://www.kitware.com/tag/web-visualization/) diff --git a/docs/vitepress/examples/apps/trame-catalyst.md b/docs/vitepress/examples/apps/trame-catalyst.md new file mode 100644 index 00000000..b43eab59 --- /dev/null +++ b/docs/vitepress/examples/apps/trame-catalyst.md @@ -0,0 +1 @@ +[![trame-catalyst](https://gitlab.kitware.com/keu-public/trame-catalyst-demo/-/raw/main/screenshot.png)](https://gitlab.kitware.com/keu-public/trame-catalyst-demo/)