Jamiu S.
Jamiu S.

Reputation: 5731

How to align plotly_chart to page center using html in streamlit

enter image description here


def plot_open_close_chart(dataframe: pd.DataFrame, name: str, start_date: int, end_date: int) -> stl.plotly_chart:
    fig = dataframe.iplot(y="Open",
             secondary_y="Close",
             secondary_y_title="Close Price ($)",
             xTitle="Date", yTitle="Open Price ($)",
             title=f'''Open and Close Price  of {name} From {start_date} To {end_date}''', asFigure=True)
    stl.plotly_chart(fig)
    get_record_low_and_high(dataframe, dataframe.Close)

I tried to set the chart to page center just like the "Record Low" below the chart is set using html but it does seem to work with the chart. It will be a pleasure if anyone can help fix this. I also tried writing fig in html and but it shows nothing in page.

Upvotes: 1

Views: 4099

Answers (2)

Rafael Colombo
Rafael Colombo

Reputation: 435

You can replace stl.plotly_chart(fig) for stl.plotly_chart(fig, use_container_width = True). This won't center align the chart, but once you close the sidebar the chart will fill the entire width of the page.

Upvotes: 2

arnaud
arnaud

Reputation: 3483

You can give a try to stl.columns and create three columns (left, middle, right) where you only use the middle one:

left, middle, right = stl.columns((2, 5, 2))
with middle:
    plot_open_close_chart()

Upvotes: 1

Related Questions