add buttons, logo, ui change

Author: KPhans

apps/dash-vehicle-geometry/app.py

@@ -4,10 +4,12 @@
 
 import dash
 import dash_bootstrap_components as dbc
+from dash_bootstrap_components._components.Col import Col
 import dash_html_components as html
 import dash_core_components as dcc
 
 from dash.dependencies import Input, Output, State
+from dash_html_components.Br import Br
 
 import dash_vtk
 from dash_vtk.utils import to_mesh_state, preset_as_options
@@ -173,16 +175,72 @@ def cache_mesh(filepath, di, fieldname=None, point_arrays=[], cell_arrays=[]):
             ),
         ]
     ),
+    html.Br(),
+    dbc.Alert(
+        "Please click on the vehicle to display the cones",
+        color="info",
+        dismissable=True,
+    ),
 ]
 
+external_buttons = html.Div(
+    [
+        html.A(
+            dbc.Button(
+                "Enterprise Demo",
+                color="primary",
+                size="md",
+                className="mr-1",
+            ),
+            href="https://plotly.com/get-demo/",
+            target="_blank",
+        ),
+        html.A(
+            dbc.Button(
+                "Source Code",
+                size="md",
+                className="mr-1",
+                color="secondary",
+            ),
+            href="https://github.com/plotly/dash-sample-apps/tree/main/apps/dash-vehicle-geometry",
+            target="_blank",
+        ),
+        html.A(
+            html.Img(
+                src=app.get_asset_url("dash-logo.png"),
+                alt="MIT Logo",
+                height="100%",
+                style={"margin-left": "15px"},
+            ),
+            href="https://plotly.com/dash/",
+            target="_blank",
+        ),
+    ],
+    style={
+        "float": "right",
+        "height": "60px",
+        "padding-bottom": "0px",
+    },
+)
+
 # -----------------------------------------------------------------------------
 # App UI
 # -----------------------------------------------------------------------------
 
 app.layout = dbc.Container(
     fluid=True,
     children=[
-        html.H2("Vehicle Geometry with OpenFOAM"),
+        dbc.Row(
+            [
+                dbc.Col(
+                    [html.H2("Vehicle Geometry with OpenFOAM")],
+                    width=7,
+                    style={"padding-top": "10px"},
+                ),
+                dbc.Col([external_buttons], width=5),
+            ],
+            style={"margin-bottom": "1px"},
+        ),
         html.Hr(),
         dbc.Row(
             [
@@ -204,7 +262,10 @@ def cache_mesh(filepath, di, fieldname=None, point_arrays=[], cell_arrays=[]):
                                 ),
                             ],
                             id="vtk-view-container",
-                            style={"height": "calc(100vh - 230px)", "width": "100%",},
+                            style={
+                                "height": "calc(100vh - 230px)",
+                                "width": "100%",
+                            },
                         ),
                     ],
                 ),
@@ -246,7 +307,7 @@ def initial_loading(geometry):
     return dash_vtk.View(
         id="vtk-view",
         children=vehicle_vtk + isosurfs_vtk + [cone_pointer, tooltip],
-        pickingModes=["hover"],
+        pickingModes=["click"],
     )
 
 
@@ -313,8 +374,13 @@ def update_scene(geometry, isosurfaces, surfcolor):
 
 
 @app.callback(
-    [Output("tooltip", "children"), Output("pointer", "state"),],
-    [Input("vtk-view", "hoverInfo"),],
+    [
+        Output("tooltip", "children"),
+        Output("pointer", "state"),
+    ],
+    [
+        Input("vtk-view", "clickInfo"),
+    ],
 )
 def probe_data(info):
     cone_state = {"resolution": 12}

apps/dash-vehicle-geometry/assets/dash-logo.png

@@ -27,6 +27,6 @@ scooby==0.5.6
 six==1.15.0
 transforms3d==0.3.1
 typing-extensions==3.7.4.3
-vtk==9.0.1
+vtk==9.0.*
 Werkzeug==1.0.1
 zipp==3.4.1