How to prevent graph dimensions on plotly from changing in streamlit

Using Streamlit
1

I am currently trying to make a line chart on streamlit using plotly. Though as more legends are added, the size seems to shift completely to the left. I have altered the width and height of the graph on python to make sure it does not go out of a certain range. But this only shows up when I expand on the graph. When it is contracted, as in viewed normally on a streamlit page, if does not perform well.

Below is the picture and the script:

Graph err
Graph err977×971 40.8 KB

 st.subheader("Time Series Analysis")
    checkbox1 = st.checkbox("Display Chart")
    if checkbox1:
        # Can select what columns to look at
        Columns_select1 = st.multiselect(label="Select Columns",
                                         options=numeric_cols)      
        # Only show dataframe with these columns
        dataframe_cols1 = Gov_df[Columns_select1]
        plotly_fig = px.line(data_frame=dataframe_cols1,x=dataframe_cols1.index,y=Columns_select1,
                            width=700, height=900) # Get data from the dataframe with selected columns, choose the x axis as the index of the dataframe, y axis is the data that will be multiselected
        
        plotly_fig.update_layout(autosize=True,
                                 legend=dict(
                                  yanchor="top",
                                  y=-0.10,
                                  xanchor="left",
                                  x=0.01
                                ))
        
        st.plotly_chart(plotly_fig)
2

you may try this:
delete the width in px.line, and change “st.plotly_chart(plotly_fig)” to “st.plotly_chart(plotly_fig,use_container_width=True)”

4 Likes
4

Thanks for this :slight_smile:

1 Like