Streamlit — это библиотека Python с открытым исходным кодом, которая позволяет легко создавать красивые настраиваемые веб-приложения для машинного обучения и обработки данных и делиться ими. Всего за несколько минут вы сможете создать и развернуть мощные приложения для работы с данными. Итак, приступим!

Мы можем использовать Streamlit для создания интерактивных презентаций с графиками, таблицами и даже видео. Вот некоторые основные функции Streamlit, которые вы можете использовать, чтобы упростить понимание всех этих данных для нас, людей.

Установка Стримлита

pip install streamlit

Ну, да.

Getting the text right

Эти команды могут отображать текст в локальном веб-приложении. Например, введите

import streamlit as st
st.header('This is a header')
st.text('This is Text')

тогда беги,

потоковый запуск ‹имя_приложения›.py

и Streamlit создаст для вас веб-приложение и разместит его на локальном сервере.

ст.написать()

В официальной документации эта команда описывается как «швейцарский армейский нож» из всех команд, и не без оснований. Используя эту команду, вы можете отобразить

  1. уценка
  2. Латекс
  3. Панды DataFrames
  4. смайлики
  5. и многое другое

Бег

st.write(df) # where df is a Pandas DataFrame
st.write(D) #where D is a Python Dictionary
st.write(':100:') #the 💯 emoji 💯

Но это не все

st.write() также может отображать изображения и графики, которые вы создаете с помощью библиотек Python, таких как Matplotlib, Ploty, Altair, Graphviz и многих других.

Чтобы отобразить простой график Matplotlib в потоке:

import streamlit as st
import numpy as np
import matplotlib.pyplot as plt
x = np.array([1, 2, 3, 4])  # X-axis points
y = x*2  # Y-axis points
  
fig,axis = plt.subplots()
axis.plot(x,y)
st.write(fig)

Существуют отдельные команды для отображения рисунков, данных или текстов в определенном формате и т. д. ( st.dataframe() для DataFrame, st.pyplot() для matplotlib объект и т. д. Полный список можно найти в readthedocs. )

Принятие пользовательского ввода

Вполне вероятно, что вы захотите, чтобы ваши пользователи взаимодействовали с вашим веб-приложением, для этого в Streamlit есть широкий набор виджетов ввода:

Есть еще много других источников.

Вы назначаете переменную виджету, и эта переменная сохраняет текущее состояние виджета, которое будет использоваться позже в вашем коде.

import streamlit as st
X = st.button('Widget 1')
Y = st.slider('Widget 2')
Z = st.date_input('Widget 3')
st.write(X) #Boolean, True/False value
st.write(Y) #int, returns value within given range (default 0-100)
st.write(Z) #datetime object

Давайте сделаем макет приложения

Давайте создадим некоторые фиктивные данные и отобразим их

import pandas as pd
import numpy as np
import streamlit as st
chart_data = pd.DataFrame(
    np.random.randn(20, 3),
    columns=['a', 'b', 'c'])
area = st.checkbox('Area Chart')
line = st.checkbox('Line Chart')
if area:
    st.area_chart(chart_data)
if line:
    st.line_chart(chart_data)

Во-первых, мы создаем некоторые фиктивные данные и сохраняем их в объекте Pandas DataFrame. Мы будем отображать данные с помощью линейной диаграммы и диаграммы с областями, используя предопределенные команды Streamlit line_chart() и area_chart() соответственно. Мы даем нашему пользователю возможность просмотреть график, который он хочет, с помощью флажков.

Вы должны увидеть что-то подобное, когда закончите. Приборная панель интерактивная, а цифры симпатичные. Но, есть что-то не совсем правильное. Все элементы располагаются друг над другом, т. е. реального форматирования нет.

Введите: макеты и контейнеры

Для начала давайте отформатируем два флажка в нашем предыдущем примере рядом друг с другом. Мы можем сделать это, используя st.columns()

Использование st.columns() создает «контейнеры», элементы div, которые форматируются рядом друг с другом. Мы можем свободно размещать элементы в столбце по нашему выбору, используя:

с ‹имя_столбца›:

Итак, наш код теперь выглядит так:

import pandas as pd
import numpy as np
import streamlit as st
chart_data = pd.DataFrame(
    np.random.randn(20, 3),
    columns=['a', 'b', 'c'])
col1,col2 = st.columns(2) #Specify the number of columns
with col1:
    area = st.checkbox('Area Chart')
with col2:
    line = st.checkbox('Line Chart')
if area:
    st.area_chart(chart_data)
if line:
    st.line_chart(chart_data)

Теперь мы хотим добавить второй набор данных, отличный от набора данных, который мы уже используем, и представить его в понятной форме.

Для этой цели мы добавим боковую панель и включим виджет радиоввода. Виджет радиоввода аналогичен кнопкам или флажкам, но он может одновременно принимать только уникальное значение, что хорошо подходит для нашей цели. Radio возвращает значение типа String в зависимости от выбранного в данный момент параметра.

import pandas as pd
import numpy as np
import streamlit as st
chart_data = pd.DataFrame(
    np.random.randn(20, 3),
    columns=['a', 'b', 'c'])
simple_data = pd.DataFrame(
        np.random.uniform(size = (20,3)),
        columns = ['a','b','c'])
area = st.checkbox('Area Chart')
line = st.checkbox('Line Chart')
with st.sidebar:
    select = st.radio('Select Dataset',('Dataset 1','Dataset 2'))
if select == 'Dataset 1':
    data = chart_data
elif select == 'Dataset 2':
    data = simple_data
if area:
    st.area_chart(data)
if line:
    st.line_chart(data)

На основе значения, отображаемого в данный момент при выборе переключателя, мы назначаем соответствующие данные переменной данных, а затем отображаем эти данные, как показано в предыдущих разделах. Чтобы немного упростить приведенный выше пример, я удалил столбцы, представленные в предыдущем разделе.

Давайте теперь добавим расположение столбцов и элемент состояния, значок загрузки, который будет отображаться, пока мы ждем компиляции кода. Наконец, чтобы сделать приложение более интересным, добавлен эффект неожиданности.

import pandas as pd
import numpy as np
import streamlit as st
chart_data = pd.DataFrame(
    np.random.randn(20, 3),
    columns=['a', 'b', 'c'])
simple_data = pd.DataFrame(
        np.random.uniform(size = (20,3)),
        columns = ['a','b','c'])
  
col1,col2 = st.columns(2)
with col1:
    area = st.checkbox('Area Chart')
with col2:
    line = st.checkbox('Line Chart')
    
with st.sidebar:
    select = st.radio('Select Dataset',('Dataset 1','Dataset 2'))
    
if select == 'Dataset 1':
    data = chart_data
elif select == 'Dataset 2':
    data = simple_data
    
with st.spinner('Loading...'):
    if area:
        st.balloons()
        st.area_chart(data)
    if line:
        st.balloons()
        st.line_chart(data)

Добавление кнопки загрузки всегда приятно, особенно когда скрытые операции занимают заметное количество времени. Вот и все!

Заключение

Естественно, в Streamlit есть намного больше. Чтобы узнать больше, лучше всего обратиться к официальной документации здесь. Большая часть этой статьи вдохновлена ​​официальной документацией. Сообщество Streamlit также очень активно, на форумах всегда приветствуются предложения (в виде вопросов) и сомнения.

Дайте мне знать, что вы думаете об этой статье. Отзывы приветствуются!