Updating a selectbox-dependent Plotly scatterplot based on click_events

Panel
1

Hi, I’m trying to react to clicks on a Plotly scatterplot inside a Panel app then update the scatterplot, using the clicked marker to display its associated text as an annotation (per the relevant dataframe row). However, being somewhat new to Panel, I can’t figure out how to deal with click event when I already have a @pn.depends reacting to selectbox changes and returning a Plotly graph in a pane (just too many moving parts coming from a Streamlit background). How would I modify this code below to accommodate and react to clicks on the rendered Plotly scatterplot graph? Thanks!

graph_options = ["Stat1", "Stat2", "Stat3", "Stat4"]
graph_option1 = pn.widgets.Select(name="x-axis Stat:", 
                options=graph_options, value="Stat1")
gui.sidebar.append(graph_option1)
graph_option2 = pn.widgets.Select(name="y-axis Stat:", 
                options=graph_options, value="Stat2")
gui.sidebar.append(graph_option2)

@pn.depends(league_selected.param.value, team_selected.param.value, 
            season_selected.param.value, graph_option1.param.value, 
           graph_option2.param.value)
def plot_pane(league_selected, team_selected, season_selected, 
              graph_option1, graph_option2):
     fig = plot_scatter(sql_engine, league_selected, None, season_selected,
           graph_option1, graph_option2)
     return pn.pane.Plotly(fig, config={'responsive': True, 
                           "displaylogo": False})

gui.main[0:4, 0:7] = plot_pane
gui.servable()
2

Hi. I tried to create an example for you. But instead I figured out that Plotly click_data events are not working in Panel 1.x.

See Broken click_data event on plotly data point since panel 1.x.x · Issue #5096 · holoviz/panel (github.com)

I need that solved first unfortunately.

1 Like
3

Thanks Marc. Doesn’t need to be Plotly though. It’s just a scatter plot so I’d be happy to use hv.scatter instead if it worked. The bigger question is how I would deal with click events in general. For example, if I change the code like this:

def plot_pane(league_selected, team_selected, season_selected, graph_option1, graph_option2):
        if league_selected != "-All Leagues-" and team_selected == "-All Teams-":
            fig = plot_scatter(sql_engine, league_selected, None, season_selected, graph_option1, graph_option2)
            return pn.pane.HoloViews(fig, sizing_mode='stretch_both', height=600, width=600)
        else:
            print("Nothing selected")
        
plot = pn.bind(plot_pane, league_selected, team_selected, season_selected, graph_option1, graph_option2)

gui.main[0:4, 0:7] = plot
gui.servable()

I still don’t know how to deal with click events as referring to plot gives me errors that it is a function, which sort of makes sense. In trying to debug and dig into the different elements I still don’t see a way.