streamlit 기본 기능 연습

streamlit 기본 기능을 연습해보았습니다.

 

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

우선 필요한 라이브러리들을 불러와줍니다.

 

st.title("이것은 타이틀이다.")

st.header('1. 이것은 헤더이다.')

st.markdown("""
            마크다운으로 문자를 써보았습니다.
            """)

 

타이틀과 헤더를 적을때는 st.title(), st.header()를 사용합니다.

st.markdown()은 마크다운 문법을 사용해서 글을 적을 수 있네요.

 

 

 

st.code("""
        코드블럭은 코드를 쓰거나, 글자를 강조합니다.
        
        from keras.preprocessing.image import ImageDataGenerator

        datagen = ImageDataGenerator(
            rotation_range=40,
            width_shift_range=0.2,
            height_shift_range=0.2,
            shear_range=0.2,
            zoom_range=0.2,
            horizontal_flip=True,
            fill_mode='nearest'
        )
        """)


st.caption("caption 기능은 인용구나, 각주등을 넣을 때 사용하기 좋습니다.")

 

st.code()로는 코드블럭을 사용할 수 있습니다.

st.caption()은 비교적 작고 흐릿한 글씨로 글을 쓸 수 있는데, 본문보다 덜 강조되는 주석 등을 적을 때 활용합니다.

 

 

 

name = st.text_input("text_input의 기능을 사용하여,
사람의 이름, 연락처 등 각종 사용자 입력을 받아볼 수 있습니다.",placeholder="홍길동")


if st.button('입력'):
    st.write(f'{name}님, 환영합니다.')

 

st.text_input()으로 단일 행의 텍스트를 입력 받을 수 있습니다.

첫번째 인자로 입력 필드의 위쪽에 표시될 문구를 입력합니다.

placeholder를 사용하면 입력 필드가 비어있을 때 예시 입력을 제공합니다.

그 외에 많이 쓰이는 인자들로는,

value=" " : 입력 필드에 초기값을 설정하여 입력을 하기 전에 기본값을 제공합니다.

type="password" : 입력된 텍스트를 마스킹하여 민감한 정보를 보호합니다.

 

st.button()은 괄호 안의 문자열 레이블을 가진 버튼을 생성하고, 버튼을 클릭하면 True를 반환합니다.

 

 

 

# input widget 연습
uploaded_file = st.file_uploader("Choose a csv file")
if uploaded_file:
    st.write("파일 이름: ",uploaded_file.name)
    
# 선택박스 widget
option = st.selectbox(
'How would you like to be contacted?',
('Email', 'Home phone', 'Mobile phone', 'Kakao Talk', 'LINE'))

st.write('You selected:', option)

 

st.file_uploader()는 파일을 업로드 할 수 있는 위젯이며 첫 번째 인자로 받는 문자열은 파일 업로더 위젯 위에 표시될 설명 텍스트입니다.

uploaded_file = st.file_uploader("Choose a csv file", type=["csv"])와 같이 적으면 파일의 형식을 설정할 수도 있습니다.

 

st.selectbox()는 사용자가 여러 옵션 중 하나를 선택하도록 하는 드롭다운 메뉴를 생성합니다.

마찬가지로 첫 번째 인자로 받는 문자열은 설명 텍스트입니다.

그 후 사용사가 선택할 수 있는 옵션 목록들을 튜플 형태로 받습니다.

 

 

 

# st.data_editor
df = pd.DataFrame(
    [
        {"지점": "김해점", "수용인원": 50, "충전가능":True},
        {"지점": "양산점", "수용인원": 40, "충전가능":False},
        {"지점": "창원점", "수용인원": 80, "충전가능":True},
        {"지점": "사천점", "수용인원": 20, "충전가능":False}
    ]
)

edited_df = st.data_editor(df, hide_index=True)
# "충전가능"이 True인 행만 필터링
filtered_df = edited_df[edited_df["충전가능"] == True]
recommend = filtered_df.loc[filtered_df["수용인원"].idxmax()]["지점"]
st.markdown(f"추천하는 지점은 **{recommend}**입니다.")

 

st.data_editor()를 사용하면 데이터 프레임을 나타내주고, 편집할 수 있도록 해줍니다.

편집한 내용은 실시간으로 반영됩니다.

 

st.markdown의 강조효과와 f-string을 사용하여 추천하는 지점을 알려주고 있습니다.

 

 

 

# st.column_config
sales_data = {
    "지점": ["김해점", "양산점", "창원점", "사천점"],
    "판매량": [np.random.randint(1, 101, size=6) for _ in range(4)],
}
sales_df = pd.DataFrame(sales_data)


st.data_editor(
    sales_df,
    column_config={
        "판매량": st.column_config.BarChartColumn(
            "각 지점 판매량 추이(최근 6개월간)",
            help="각 지점의 최근 판매량 추이입니다.",
            y_min=1,
            y_max=100,
        )
    }
    ,hide_index=True
)

st.data_editor(
    sales_df,
    column_config={
        "판매량": st.column_config.LineChartColumn(
            "각 지점 판매량 추이(최근 6개월간)",
            help="각 지점의 최근 판매량 추이입니다.",
            y_min=1,
            y_max=100,
        )
    }
    ,hide_index=True
)

sales_data 딕셔너리를 생성하여 각 지점의 이름과 판매량 데이터를 포함합니다.

np.random.randint(1, 101, size=6)는 1부터 100 사이의 랜덤한 정수를 6개 생성하여 각 지점의 판매량으로 사용합니다.

sales_df는 sales_data를 기반으로 생성된 판다스 데이터프레임입니다.

 

st.data_editor는 Streamlit의 데이터 편집기 위젯을 생성합니다.

column_config를 사용하여 “판매량” 열을 바 차트로 시각화합니다.

• BarChartColumn은 바 차트를 생성하는 설정을 포함합니다.
• y_min과 y_max는 y축의 최소값과 최대값을 설정합니다.

hide_index=True는 데이터프레임의 인덱스를 숨깁니다.

 

 

 

st.header("2. 각 지점의 1년간 순수익 그래프")
# line chart, area chart, bar chart 연습
margin_df = pd.DataFrame(
    np.random.randn(12,4),
    columns=["김해점", "양산점", "창원점", "사천점"]
)

# 라인 차트, 영역 차트, 막대 차트 생성
"각 지점의 1년간 순수익(라인 차트)"
st.line_chart(margin_df)
"각 지점의 1년간 순수익(영역 차트)"
st.area_chart(margin_df)
"각 지점의 1년간 순수익(막대 차트)"
st.bar_chart(margin_df)

DataFrame을 각각 line_chart, area_chart, bar_chart로 시각화하는 코드입니다.

streamlit의 magic기능을 사용하여 st.write()를 생략하고 문자열을 바로 출력하고 있습니다.

해당 기능을 사용하면 마크다운이나 데이터프레임도 바로 출력할 수 있습니다.

 

 

 

with st.sidebar:
    add_selectbox = st.selectbox(
        "가고 싶은 여행지는?",
        ("중국", "일본", "유럽", '미국', '호주')
    )   
    if add_selectbox == "호주":
        f'{name}님 {add_selectbox}로 떠날 계획이시군요?' # streamlit magic
    else:
        f'{name}님 {add_selectbox}으로 떠날 계획이시군요?'
    add_radio = st.radio(
        "여행 기간을 골라주세요.",
        ("장기 (3달 초과)", "중장기 (1달 초과 3달 이하)", "중간 (1주일 초과 한달 이하)", "단기 (1주일 이하)")
    )
    st.write(add_radio, '를 선택하셨습니다.')

 

with st.sidebar:를 사용하여 사이드바 영역을 정의합니다. 이 안에 있는 모든 위젯은 사이드바에 표시됩니다.

st.selectbox는 위에서 다루었으므로 생략합니다.

 

st.radio()를 사용하여 사용자가 여행 기간을 선택할 수 있는 라디오 버튼을 생성합니다.

st.selectbox()와 마찬가지로, 첫 번째 인자로 위젯 위에 설명 텍스트를 표기합니다.

다음 인자는 튜플로 사용자가 선택 가능한 옵션 목록을 입력합니다.

 

 

 

    '''
    '해당 여행 기간동안의 ***_평균 항공권 금액_***을 검색하겠습니까?'
    '''
    CAUTION = """
    	선택하신 항공권의 금액을 검색하겠습니다. **현재 유가 상승으로 인하여**, 
        모든 항공권의 가격이 상승하고 있습니다. 갑작스러운 변동에는 보장드릴 수 없음을 안내드립니다.
        """

    def stream_data():
        for word in CAUTION.split(" "):
            yield word + " "
            time.sleep(0.02)
        yield pd.DataFrame(np.random.randn(5, 10), 
        columns=["a", "b", "c", "d", "e", "f", "g", "h", "i", "j"])

    if st.button('검색'):
        st.write_stream(stream_data)

st.sidebar()의 영향으로 계속해서 사이드바에 내용이 표시되고 있습니다.

streamlit의 magic기능으로 st.markdown()을 적지 않고도 마크다운 문법을 사용하고 있습니다.

 

stream_data 함수는  CAUTION 변수에 담아놓은 문자열을 단어 단위로 나누어 하나씩 반환(yield)합니다.

각 단어 뒤에 " " (공백)을 추가하여 원래의 띄어쓰기가 있던 문장의 형태를 유지하고 가독성을 높입니다.

각 단어를 반환한 후 time.sleep(0.02)를 사용하여 0.02초 동안 대기합니다.

pd.DataFrame을 생성하여 임의의 데이터를 포함한 데이터프레임을 반환합니다.

참고로, st.write()를 사용하면 stream효과를 얻을 수 없습니다.