Streamlitによるダッシュボード

ダッシュボードを作るライブラリとしてはDashを使っているが、ちょっと難しくて初心者には敷居が高いと感じていた。学生や共同研究者に依頼してもPlotlyまではかけるが、Dashは難しいようだ。

もっと簡単なものを探していたら、Streamlitというのを見つけた。

streamlit/streamlit

Plotlyの図オブジェクトも入れられる。例えば、ガントチャートはこんな感じだ。

import streamlit as st
st.title('My first app')
import plotly.figure_factory as ff
df = [dict(Task="Job A", Start='2009-01-01', Finish='2009-02-28'),
dict(Task="Job B", Start='2009-03-05', Finish='2009-04-15'),
dict(Task="Job C", Start='2009-02-20', Finish='2009-05-30')]
fig = ff.create_gantt(df)
st.plotly_chart(fig)

Dashと違うのは１ページのダッシュボードを、確認しながらpyファイルをかけることだ。パイソンでコードをかくと、ブラウザにリアルタイムで結果が反映される。Dashもこの辺りのUIを見習って、簡単になってくれると嬉しい。

オフィシャルページにある例を試してみた．コピペしながらブラウザで反応を確認すれば簡単に理解できる．

https://docs.streamlit.io/getting_started.html#import-streamlit
にあるGet Startedの例題とUberの例題．

import streamlit as st
# To make things easier later, we're also importing numpy and pandas for
# working with sample data.
import numpy as np
import pandas as pd
st.title('My first app')
st.write("Here's our first attempt at using data to create a table:")
#if st.checkbox('Show dataframe１'):
df = pd.DataFrame({
'first column': [1, 2, 3, 4],
'second column': [10, 20, 30, 40]
})
df
if st.checkbox('Show dataframe２'):
   chart_data = pd.DataFrame(
       np.random.randn(20, 3),
       columns=['a', 'b', 'c'])
   st.line_chart(chart_data)
if st.checkbox('Show dataframe３'):
   map_data = pd.DataFrame(
       np.random.randn(1000, 2) / [50, 50] + [37.76, -122.4],
       columns=['lat', 'lon'])
   st.map(map_data)
option = st.sidebar.selectbox(
   'Which number do you like best?',
    df['first column'])
'You selected:', option
import time 
# Add a placeholder
if st.checkbox('Show dataframe4'):
   latest_iteration = st.empty()
   bar = st.progress(0)
   for i in range(100):
       # Update the progress bar with each iteration.
       latest_iteration.text(f'Iteration {i+1}')
       bar.progress(i + 1)
       time.sleep(0.1)
   '...and now we\'re done!'

#Uberの例題

import streamlit as st
import numpy as np
import pandas as pd
st.title('Uber pickups in NYC')
DATE_COLUMN = 'date/time'
DATA_URL = ('https://s3-us-west-2.amazonaws.com/'
        'streamlit-demo-data/uber-raw-data-sep14.csv.gz')
@st.cache
def load_data(nrows):
   data = pd.read_csv(DATA_URL, nrows=nrows)
   lowercase = lambda x: str(x).lower()
   data.rename(lowercase, axis='columns', inplace=True)
   data[DATE_COLUMN] = pd.to_datetime(data[DATE_COLUMN])
   return data
# Create a text element and let the reader know the data is loading.
data_load_state = st.text('Loading data...')
# Load 10,000 rows of data into the dataframe.
data = load_data(10000)
# Notify the reader that the data was successfully loaded.
data_load_state.text('Loading data...done!')
if st.checkbox('Show raw data'):
   st.subheader('Raw data')
   st.write(data)
if st.checkbox('Show Histgram'):
   st.subheader('Number of pickups by hour')
   hist_values = np.histogram(
       data[DATE_COLUMN].dt.hour, bins=24, range=(0,24))[0]
   st.bar_chart(hist_values)

hour_to_filter = st.slider('hour', 0, 23, 17)  
filtered_data = data[data[DATE_COLUMN].dt.hour == hour_to_filter]
st.subheader(f'Map of all pickups at {hour_to_filter}:00')
st.map(filtered_data)