Black Lives Matter. Please consider donating to Black Girls Code today.

Add on_click event to html scatter charts

Hello,

I’m trying to add an on_click event to a set of scatter plots that are saved to an html file.

I have a list defined which will “hold” the scatter plots as they are built in a loop.

My code is as follows:

fig.add_trace(go.Scatter(
                        x = timestamp_dates_slew, 
                        y = slew_duration_slew, 
                        name = VALID_SLEW_TO_MODES[j],
                        text = [f'{dt.datetime.strftime(d, "%Y-%m-%dT%H:%M:%S")}' for d in timestamp_dt],
                        mode = "markers",
                        hovertemplate = 
                        '%{name}' +
                        '<br><br>' +
                        '<b>Timestamp:</b> %{text}<br>' +
                        '<b>Duration:</b> %{y} sec<extra></extra>',
                        marker = dict(
                                size = 5,
                                color = COLORS[j]
                                ),
                        showlegend=True if VALID_SLEW_TO_MODES[j] not in trace_names else False), 
                        row=1, col=(SPACECRAFT_ID.index(sc)+1))
                trace_names.add(VALID_SLEW_TO_MODES[j])
                
scatter_holder.append(fig.data[-1])
                
def open_browser(trace, points, selector):
    #Actual version will open a webpage using data from the point clicked
    webbrowser.open_new_tab('https://www.google.com')
    return
                
scatter_holder[-1].on_click(open_browser)

When clicking on the chart, a new tab does not open. I’m obviously doing something wrong, but am somewhat new to plotly and not sure how mouse events work.

Any help, or references would be appreciated.

Thank you!

Does anyone have any advice on this? Perhaps @Emmanuelle?

Thank you in advance for your help. It’s really appreciated.