Skip to content

Commit ab4b2a8

Browse files
jourdainjourdain
committed
add viewer
1 parent 0199ffa commit ab4b2a8

File tree

9 files changed

+68
-41
lines changed

9 files changed

+68
-41
lines changed

‎docs/.vitepress/config.mjs‎

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -21,10 +21,10 @@ export default defineConfig({
2121
gtag('js', new Date());
2222
gtag('config', 'G-LLSX9WG6YK');`
2323
],
24-
[
25-
'script',
26-
{ defer: '', src: 'js/hero.js' }
27-
]
24+
// [
25+
// 'script',
26+
// { defer: '', src: 'js/hero.js' }
27+
// ]
2828
],
2929
themeConfig: {
3030
// https://vitepress.dev/reference/default-theme-config
@@ -79,6 +79,13 @@ export default defineConfig({
7979
{ text: 'Method call', link: '/guide/trame/picking' },
8080
]
8181
},
82+
{
83+
text: 'As a data viewer',
84+
items: [
85+
{ text: 'Getting started', link: '/guide/viewer/index' },
86+
{ text: 'Generating data', link: '/guide/viewer/data' },
87+
]
88+
},
8289
],
8390
'/usecase/': [
8491
{ text: 'Examples', link: '/usecase/index' },

‎docs/guide/trame/picking.md‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,10 @@ In the example below we cover how you can create such widget in plain VTK and ho
99
The code below highlight some important region and logic to understand.
1010

1111
::: code-group
12-
<<< ../../../examples/trame/picking/pick.py#vtk{py:line-numbers=45} [VTK 3D Widget]
13-
<<< ../../../examples/trame/picking/pick.py#trameWidget{py:line-numbers=85} [Trame widget]
14-
<<< ../../../examples/trame/picking/pick.py#trameChange{py:line-numbers=121} [State change]
15-
<<< ../../../examples/trame/picking/pick.py#py2wasmCall{py:line-numbers=130} [Method call]
12+
<<< ../../../examples/trame/picking/pick.py#vtk{py:line-numbers=42} [VTK 3D Widget]
13+
<<< ../../../examples/trame/picking/pick.py#trameWidget{py:line-numbers=82} [Trame widget]
14+
<<< ../../../examples/trame/picking/pick.py#trameChange{py:line-numbers=118} [State change]
15+
<<< ../../../examples/trame/picking/pick.py#py2wasmCall{py:line-numbers=128} [Method call]
1616
<<< ../../../examples/trame/picking/pick.py{py:line-numbers} [Full code (pick.py)]
1717
<<< ../../../examples/trame/picking/requirements.txt
1818
:::

‎docs/guide/viewer/data.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
# VTK.wasm viewer data format

‎docs/guide/viewer/index.md‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
# VTK.wasm viewer
2+
3+
Thanks to VTK.wasm we are getting close to full parity with what is available in VTK C++ and therefore can create viewers that display scenes equivalent to what you can produce with ParaView or any VTK based application.
4+
5+
<div style="width: 100%; height: 50vh; border-radius: 12px; overflow: hidden; margin: 1rem 0;">
6+
<iframe src="/vtk-wasm/demo/viewer-basic.html" style="width: 100%; height: 100%; border: none;">
7+
</iframe>
8+
</div>
9+
10+
<<< ../../public/demo/viewer-basic.html

‎docs/index.md‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,5 +47,15 @@ features:
4747
width: 20
4848
details: Kitware can help you get started intergrating ParaView Catalyst into your simulation. Our team is here to help. Please contact us
4949
link: https://www.kitware.com/support
50+
# - title: WASM Viewer
51+
# icon:
52+
# src: /logo.svg
53+
# alt: WASM viewer
54+
# width: 75
55+
# details: '<iframe src="./demo/viewer-basic.html" style="width: 100%; height: 100%; border: none"></iframe>'
5056
---
5157

58+
<div style="width: 100%; height: 50vh; border-radius: 12px; overflow: hidden; margin: 1rem 0;">
59+
<iframe src="./demo/viewer-basic.html" style="width: 100%; height: 100%; border: none;">
60+
</iframe>
61+
</div>

‎docs/public/demo/viewer-basic.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<html>
22
<head>
3-
<script src="/vtk-wasm/lib/viewer.umd.js"></script>
3+
<script src="https://unpkg.com/@kitware/trame-vtklocal@1.0.1/dist/umd/viewer.umd.js"></script>
44
</head>
5-
<body>
5+
<body style="margin:0">
66
<div id="viewer"></div>
77
<script>
88
vtkWASMViewer.createViewer(

‎examples/trame/picking/pick.py‎

Lines changed: 19 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -16,22 +16,19 @@
1616

1717

1818
def next_color():
19-
r = RND_SEQ.GetRangeValue(0.4, 1.0)
20-
RND_SEQ.Next()
21-
g = RND_SEQ.GetRangeValue(0.4, 1.0)
22-
RND_SEQ.Next()
23-
b = RND_SEQ.GetRangeValue(0.4, 1.0)
24-
RND_SEQ.Next()
25-
26-
return (r, g, b)
19+
rgb = []
20+
for _ in range(3):
21+
rgb.append(RND_SEQ.GetRangeValue(0.4, 1.0))
22+
RND_SEQ.Next()
23+
return rgb
2724

2825

2926
def apply_settings(property):
3027
property.diffuse_color = next_color()
31-
property.diffuse = (0.8,)
32-
property.specular = (0.5,)
33-
property.specular_color = ((1, 1, 1),)
34-
property.specular_power = (30,)
28+
property.diffuse = 0.8
29+
property.specular = 0.5
30+
property.specular_color = (1, 1, 1)
31+
property.specular_power = 30
3532

3633

3734
class Pick(TrameApp):
@@ -41,7 +38,7 @@ def __init__(self, server=None):
4138
self._build_ui()
4239

4340
def _setup_vtk(self):
44-
#region vtk
41+
# region vtk
4542
renderer = vtk.vtkRenderer()
4643
renderWindow = vtk.vtkRenderWindow()
4744
renderWindow.AddRenderer(renderer)
@@ -69,7 +66,7 @@ def _setup_vtk(self):
6966
self.last_picked_property = vtk.vtkProperty()
7067
self.renderer = renderer
7168
self.render_window = renderWindow
72-
#endregion vtk
69+
# endregion vtk
7370

7471
def _build_ui(self):
7572
with VAppLayout(self.server) as layout:
@@ -81,7 +78,7 @@ def _build_ui(self):
8178
style="top:1rem;right:1rem;z-index:1;position:absolute;",
8279
)
8380

84-
#region trameWidget
81+
# region trameWidget
8582
with vtklocal.LocalView(
8683
self.render_window,
8784
throttle_rate=20,
@@ -104,7 +101,7 @@ def _build_ui(self):
104101
{
105102
wasm_interactor_id: {
106103
# Use "MouseMoveEvent" for more flashy interaction
107-
"LeftButtonPressEvent": {
104+
"LeftButtonPressEvent": {
108105
"clicked_pos": {
109106
"x": (wasm_interactor_id, "EventPosition", 0),
110107
"y": (wasm_interactor_id, "EventPosition", 1),
@@ -115,18 +112,19 @@ def _build_ui(self):
115112
)
116113
# => reserve state variable for widget update
117114
self.state.clicked_pos = None
118-
#endregion trameWidget
115+
# endregion trameWidget
119116

120-
#region trameChange
117+
# region trameChange
121118
@change("clicked_pos")
122119
def on_click(self, clicked_pos, **_):
123120
if clicked_pos is None:
124121
return
125122

126123
asynchronous.create_task(self._pick_actor(**clicked_pos))
127-
#endregion trameChange
128124

129-
#region py2wasmCall
125+
# endregion trameChange
126+
127+
# region py2wasmCall
130128
async def _pick_actor(self, x, y):
131129
# Trigger a pick on client
132130
picked_worked = await self.ctx.wasm_view.invoke(
@@ -155,7 +153,7 @@ async def _pick_actor(self, x, y):
155153
# Render
156154
self.ctx.wasm_view.update()
157155

158-
#endregion py2wasmCall
156+
# endregion py2wasmCall
159157

160158

161159
def main():

‎examples/trame/simple/cone.py‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ def __init__(self, server=None):
1515
self._build_ui()
1616

1717
def _setup_vtk(self):
18-
#region vtk
18+
# region vtk
1919
renderer = vtk.vtkRenderer()
2020
renderWindow = vtk.vtkRenderWindow()
2121
renderWindow.AddRenderer(renderer)
@@ -33,7 +33,7 @@ def _setup_vtk(self):
3333
renderer.AddActor(actor)
3434
renderer.ResetCamera()
3535
renderWindow.Render()
36-
#endregion vtk
36+
# endregion vtk
3737

3838
self.render_window = renderWindow
3939
self.cone = cone_source
@@ -70,14 +70,14 @@ def _build_ui(self):
7070
)
7171

7272
with layout.content:
73-
#region widget
73+
# region widget
7474
with vtklocal.LocalView(
7575
self.render_window,
7676
throttle_rate=20,
7777
) as view:
7878
self.ctrl.view_update = view.update_throttle
7979
self.ctrl.view_reset_camera = view.reset_camera
80-
#endregion widget
80+
# endregion widget
8181

8282
@change("resolution")
8383
def on_resolution(self, resolution, **_):

‎examples/trame/widget/clip.py‎

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ def _setup_vtk(self):
5858
renderer.ResetCamera()
5959
renderWindow.Render()
6060

61-
#region widget
61+
# region widget
6262
# Widget setup
6363
rep = vtk.vtkImplicitPlaneRepresentation(
6464
place_factor=1.25,
@@ -73,7 +73,7 @@ def _setup_vtk(self):
7373
interactor=renderWindowInteractor, representation=rep
7474
)
7575
plane_widget.On()
76-
#endregion widget
76+
# endregion widget
7777

7878
self.plane = plane
7979
self.render_window = renderWindow
@@ -110,7 +110,7 @@ def _build_ui(self):
110110
)
111111

112112
with layout.content:
113-
#region trameWidget
113+
# region trameWidget
114114
with vtklocal.LocalView(
115115
self.render_window,
116116
throttle_rate=20,
@@ -151,7 +151,7 @@ def _build_ui(self):
151151
# => reserve state variable for widget update
152152
self.state.plane_widget = None
153153

154-
#endregion trameWidget
154+
# endregion trameWidget
155155

156156
@change("show_ctx")
157157
def on_show_ctx(self, show_ctx, **_):
@@ -163,7 +163,7 @@ def on_opacity(self, opacity, **_):
163163
self.actor.property.opacity = opacity
164164
self.ctrl.view_update()
165165

166-
#region trameChange
166+
# region trameChange
167167
@change("plane_widget")
168168
def on_plane_widget(self, plane_widget, **_):
169169
if plane_widget is None:
@@ -176,7 +176,8 @@ def on_plane_widget(self, plane_widget, **_):
176176
self.plane.SetNormal(normal)
177177

178178
self.ctrl.view_update()
179-
#endregion trameChange
179+
180+
# endregion trameChange
180181

181182

182183
def main():

0 commit comments

Comments
 (0)