[streamlit] 앱 디자인 > Animate and update elements

[출처] https://docs.streamlit.io/develop/concepts/design/animate

Streamlit Docs

---

차트나 데이터 프레임을 표시하고 앱이 실행되는 동안 실시간으로 수정하려는 경우가 있습니다(예: 루프에서). 일부 요소에는 앱을 다시 실행하지 않고도 제자리에서 업데이트할 수 있는 메서드가 내장되어 있습니다.

업데이트 가능한 요소는 다음과 같습니다:

• st.empty 컨테이너는 순서대로 쓸 수 있으며 항상 마지막으로 쓴 내용을 표시합니다. 메서드처럼 추가로 .empty()을 호출하여 지울 수도 있습니다.
• 데이터를 추가하는 .add_rows() 메서드를 사용하여 st.dataframe, st.table 및 많은 차트 요소를 업데이트할 수 있습니다.
• st.progress 요소는 추가 .progress() 호출로 업데이트할 수 있습니다. .empty() 메서드 호출로 지울 수도 있습니다.
• st.status 컨테이너에는 레이블, 확장 상태 및 상태를 변경하는 .update() 메서드가 있습니다.
• .toast() 호출을 추가하여 st.toast 메시지를 제자리에서 업데이트할 수 있습니다.

---

1. st.empty containers

st.empty은 하나의 엘리먼트를 담을 수 있습니다. st.empty 컨테이너에 엘리먼트를 쓰면 스트림릿은 이전 콘텐츠를 버리고 새 엘리먼트를 표시합니다. .empty()을 메서드로 호출하여 st.empty 컨테이너를 비울 수도 있습니다. 요소 집합을 업데이트하려면 st.empty 안에 일반 컨테이너(st.container())를 사용하고 일반 컨테이너에 콘텐츠를 작성합니다. 원하는 만큼 자주 일반 컨테이너와 그 내용을 다시 작성하여 앱의 표시를 업데이트하세요.

2. The .add_rows() method

st.dataframe, st.table 및 모든 차트 함수는 출력에서 .add_rows() 메서드를 사용하여 변경할 수 있습니다. 다음 예제에서는 my_data_element = st.line_chart(df)를 사용합니다. st.table, st.dataframe 및 대부분의 다른 간단한 차트는 st.line_chart로 바꾸기만 하면 이 예제를 사용해 볼 수 있습니다. st.dataframe은 기본적으로 처음 10개의 행만 표시하고 추가 행을 스크롤할 수 있습니다. 즉, st.table이나 차트 요소에서처럼 행을 추가하는 것이 시각적으로 명확하지 않습니다.

import streamlit as st
import pandas as pd
import numpy as np
import time

df = pd.DataFrame(np.random.randn(15, 3), columns=(["A", "B", "C"]))
my_data_element = st.line_chart(df)

for tick in range(10):
    time.sleep(.5)
    add_df = pd.DataFrame(np.random.randn(1, 3), columns=(["A", "B", "C"]))
    my_data_element.add_rows(add_df)

st.button("Regenerate")