如何在 streamlit 中的列内绘制图形

Posted 2023-03-29

【中文标题】如何在 streamlit 中的列内绘制图形

【英文标题】：How can I plot graphs inside columns in streamlit

【发布时间】：2021-08-05 05:34:54

【问题描述】：

我尝试了以下方法-

col1, col2, col3 = st.beta_columns(3)
col1.header = "confirmed"
col1.write("col1")
fig_con = alt.Chart(df).mark_line().encode(
  alt.X("days"),
  alt.Y("confirmed")
)
col1.st.altair_chart(fig_con)

col2.header = "recovered"
col2.write("col2")
fig_rec = alt.Chart(df).mark_line().encode(
  alt.X("days"),
  alt.Y("recovered")
)
col2.st.altair_chart(fig_rec)

col3.header = "deceased"
col3.write("col3")
fig_dec = alt.Chart(df).mark_line().encode(
  alt.X("days"),
  alt.Y("deceased")
)
col3.st.altair_chart(fig_dec)

但这似乎是错误的语法。

如果我这样做-

col1, col2, col3 = st.beta_columns(3)
col1.header = "confirmed"
col1.write("col1")
fig_con = alt.Chart(df).mark_line().encode(
  alt.X("days"),
  alt.Y("confirmed")
)
st.altair_chart(fig_con)

col2.header = "recovered"
col2.write("col2")
fig_rec = alt.Chart(df).mark_line().encode(
  alt.X("days"),
  alt.Y("recovered")
)
st.altair_chart(fig_rec)

col3.header = "deceased"
col3.write("col3")
fig_dec = alt.Chart(df).mark_line().encode(
  alt.X("days"),
  alt.Y("deceased")
)
st.altair_chart(fig_dec)

这会将它们绘制在一个下方。

由于列功能处于测试阶段，因此文档有点稀缺。

【参考方案1】：

使用with col:

with col1:    
    col1.header = "confirmed"
    col1.write("col1")
    fig_con = alt.Chart(df).mark_line().encode(
      alt.X("days"),
      alt.Y("confirmed")
    )
    st.altair_chart(fig_con)
    
with col2:
    col2.header = "recovered"
    col2.write("col2")
    fig_rec = alt.Chart(df).mark_line().encode(
      alt.X("days"),
      alt.Y("recovered")
    )
    st.altair_chart(fig_rec)

with col3:
    col3.header = "deceased"
    col3.write("col3")
    fig_dec = alt.Chart(df).mark_line().encode(
      alt.X("days"),
      alt.Y("deceased")
    )
    st.altair_chart(fig_dec)