Add x-axis, y-axis name and title to the chart

[hahahazel]

How do I add x-axis, y-axis name and Title to the graph on a line chart?

            chart_data = pd.DataFrame(
                np.random.rand(10, 4),
                columns= ["NO2","C2H5CH","VOC","CO"])
            st.line_chart(chart_data, height=210)

See chart.
I want to add x-axis as time, y-axis as value, title = measure of different elements over time.

Thanks in advance.

[MURTAZA_JABALPURWALA]

I am facing the same issue. I wuld be happy if someone can answer this question.

[godot63]

@hahahazel

measure of different elements over time

hi @hahahazel
st.line_chart is a wrapper around the Altair library. st.line_char can only be used in very simple cases, outside of *hello world applications", you quickly need to use a graphic library. See below how to create the graphic with Altair. Note, that I have added a date column to your dataframe to be used as an x-axis. Also, Altair works best if your dataframe is melted, which means, that instead of having a column for each parameter, one value is stored per row in 2 columns: one column holding the parameter name, another column to hold the value. It’s a bit more code, but Iif you want to use plots in a productive setting, you need to use a graphics library: Altair is a good choice, but plotly, matplotlib or bokeh are other great candidates that are easy to use in Streamlit. Hope that helps.

import streamlit as st
import pandas as pd
import altair as alt
import numpy as np

df = pd.DataFrame(
                np.random.rand(10, 4),
                columns= ["NO2","C2H5CH","VOC","CO"])
# generate a date range to be used as the x axis
df['date'] =  pd.date_range("2014-01-01", periods=10, freq="m")
df_melted = pd.melt(df,id_vars=['date'],var_name='parameter', value_name='value')
c = alt.Chart(df_melted, title='measure of different elements over time').mark_line().encode(
     x='date', y='value', color='parameter')

st.altair_chart(c, use_container_width=True)