Here is my hacky way to do it in a notebook:
import panel as pn
pn.extension('vtk')
# create a vtk pane
dragon = pn.pane.VTK('https://raw.githubusercontent.com/Kitware/vtk-js/master/Data/StanfordDragon.vtkjs',
sizing_mode='stretch_width', height=400, enable_keybindings=True, orientation_widget=True,
serialize_on_instantiation=True)
# comm to add an event listener on the vtk pan
comm_py_js = pn.widgets.StaticText(style={'visibility': 'hidden', 'width': 0, 'height': 0, 'overflow': 'hidden'}, margin=0)
# comm to return informations from javascript to python
comm_js_py = pn.widgets.StaticText(style={'visibility': 'hidden', 'width': 0, 'height': 0, 'overflow': 'hidden'}, margin=0)
comm_py_js.jscallback(args={'vtkpan':dragon, "comm_js_py":comm_js_py}, value="""
vtkpan.renderer_el.getContainer().addEventListener("click", (evt) => {
const mouse_pos = {
screenX: evt.screenX,
screenY: evt.screenY,
clientX: evt.clientX,
clientY: evt.clientY,
}
comm_js_py.setv({text: JSON.stringify(mouse_pos)}, {silent: true})
comm_js_py.properties.text.change.emit()
})
""")
# ouput div to write some information retrieve on python side
output_div = pn.widgets.StaticText(width=500, value='')
def update_output(*events):
output_div.value += events[0].new + '\n'
comm_js_py.param.watch(update_output, ['value'], onlychanged=False)
display(pn.Column(comm_js_py, comm_py_js, pn.Row(dragon, output_div), sizing_mode="stretch_width"))
comm_py_js.param.trigger("value") #set the mouse click event (must happen after the panel display)
