St.line_chart

🎈 Using Streamlit
3

Hi @hwetsman - welcome to the community, and your questions are never a bother! The short answer is that you can do some of this with st.line_chart but to get more complex you should use one of the supported libraries like Altair or Plotly, you can see all supported charting libraries here. But let’s dig into these one by one:

St.line_chart is meant to be pretty straightforward and simple, which means we don’t currently have a lot of customization allowed. But there are a few things we can do to solve your problems! First, st.line_chart takes its legend from the column names. So to have them named you just need to rename your columns. For example:

linedata = pd.DataFrame([
    recept_list[1000:cycles],,
    toneset[1000:cycles],
    horizontal,
]).T.rename(columns={0:'a', 1:'b', 2:'c'})

That should give you a legend with a, b, c in it.

On the height side that is an issue we’re tracking. Some users have hacked around it with Altair charts and you can see that discussion here: Something not working with Altair chart height past v0.47.4?

If you want to do more complex charts, I’d suggest that you use one of the supported libraries. For example here’s Altair code you could use with Streamlit in order to specify the color for each line and to specify chart dimensions:

series = pd.DataFrame({
  'year': ['2010', '2011', '2012', '2013','2010', '2011', '2012', '2013'],
  'animal': ['antelope', 'antelope', 'antelope', 'antelope', 'velociraptor', 'velociraptor', 'velociraptor', 'velociraptor',],
  'count': [8, 6, 3, 1, 2, 4, 5, 5]
})

# Basic Altair line chart where it picks automatically the colors for the lines
basic_chart = alt.Chart(series).mark_line().encode(
    x='year',
    y='count',
    color='animal',
    # legend=alt.Legend(title='Animals by year')
)

# Custom Altair line chart where you set color and specify dimensions
custom_chart = alt.Chart(series).mark_line().encode(
    x='year',
    y='count',
    color=alt.Color('animal',
            scale=alt.Scale(
                domain=['antelope', 'velociraptor'],
                range=['blue', 'red'])
                )
).properties(
    width=900,
    height=500
)

st.altair_chart(basic_chart)
st.altair_chart(custom_chart)

You can read more about that in the Altair Encoding documentation and here’s a good thread on specifying colors in Altair. Let me know if that helps!