Plotly click events in streamlit

I am using streamlit library for simple dashboard. Is it possible to use plotly click events in streamlit. Is there any other way to get click events on bar chart, scatter plots, etc, in streamlit?

The code that i tried :

import plotly.graph_objects as go
import streamlit as st
import numpy as np

def update_point(trace, points, state):
print(trace, points, state)

def main():
np.random.seed(1)
x = np.random.rand(10)
y = np.random.rand(10)
f = go.FigureWidget([go.Scatter(x=x, y=y)])
s = f.data[0]

st.plotly_chart(f)
s.on_click(update_point)

if name == ‘main’:
main()

4 Likes

Hi @sandesh_more

That kind of interactivity is currently not supported. See https://github.com/streamlit/streamlit/issues/455

1 Like

Thanks for the reply.

1 Like

Hi, I see this thread was created in 2019, I just wanted to know if there have been updates on this matter? i.e. using go.FigureWidget and get outputs from graph selection?

2 Likes

New functionality!

8 Likes

How can I return the min, max X values from a selection?

2 Likes

Does this support the use_container_width argument when displaying the figure?

2 Likes

Hi, I have added this event somewhere in between my Streamlit dashboard for a specific visual. The code would not run beyond that specific visual in the first go until I click on it and create a streamlit event, only then the rest of the visuals would get displayed. Can anyone help with it?

1 Like

Does it support

use_container_width

?

1 Like

Yes, st.plotly_chart contains a boolean use_container_width parameter:

2 Likes

This changes the theme of any plotly chart to black and white. Any thoughts on how to solve this?

3 Likes

@R_D , can you explain your problem more? Maybe post some screenshots and some code?

1 Like

Hey, ran into the same issue and figured out what’s wrong. Looks like the recent streamlit update is trying to managing plotly’s color. As a result all the color will show up as black unless you use streamlit’s plotly_chart method.

Here is the thread talking about the exact same issue.

Hopefully streamlit will fix this. In the mean time if you explicit set plotly line color (might have to use plotly’s graph_object interface) the color will appear correctly.

2 Likes

Hi @Kevin1 ,

Thanks for pointing out this out. I hadn’t noticed this and I wish I had earlier.

If you wish to change the colors to the plotly colors instead of the black,

you can put this in your script:

import plotly.io as pio
pio.templates.default = "plotly"

You can test this out by changing the colors in the underlying script to whatever. Right now in the script, they are streamlit colors.

import plotly.io as pio
import streamlit as st
import plotly.express as px

pio.templates.default = "plotly"

df = px.data.tips()
fig = px.scatter(
    df,
    x="total_bill",
    y="tip",
    color="day",
    color_discrete_sequence=[
        "#0068c9",
        "#83c9ff",
        "#ff2b2b",
        "#ffabab",
        "#29b09d",
        "#7defa1",
        "#ff8700",
        "#ffd16a",
        "#6d3fc0",
        "#d5dae5",
    ],
    title="streamlit colors",
)
st.plotly_chart(fig)
2 Likes

Hi, This discussion was very helpful! Thanks all!
I have a quick question, I am using Plotly-events for capturing user selection from a bar chart but I want to reset this selection to null when my streamlit dashboard reloads. How can I make this happen? Thanks.

2 Likes

Hi, any update regarding getting the clicked point from a plotly chart?
The work around of using plotly-events doesn’t work well after streamlit 1.12.0.
Thanks!

4 Likes

I am also facing problems regarding this, did you find any fixes?

1 Like

This is no longer working with the latest updates

2 Likes

I believe they have fixed this