Erstellen Sie mit Streamlit schnell ein Python-Datenanalyse-Dashboard und stellen Sie es in AWS bereit

Einführung

Ich möchte ein Dashboard erstellen, mit dem Daten intuitiv visualisiert, analysiert und als Webanwendung veröffentlicht werden können. Aber HTML, CSS und JS sind problematisch, deshalb möchte ich mich nicht mit ihnen anlegen. In einem solchen Fall können Sie mit Streamlit problemlos ein Datenanalyse-Dashboard mit nur einem Python-Skript erstellen. In diesem Artikel

• App-Erstellungsprozess (Installation, Datenaufbereitung, Dashboard-Erstellung) --Verfahren für die Bereitstellung auf einer AWS EC2-Instanz

Ich werde gehen Da dies eine solche Zeit ist, sollten Sie sich als Thema die Daten ansehen, die den Verkehr von Menschen in den 23 Bezirken Tokios bestätigen können, die in Yahoo Data Solution veröffentlicht wurden, sowie die neue Corona Lassen Sie uns die Auswirkungen der Maßnahmen überprüfen.

\ # Insbesondere die zweite Hälfte ist eine Aufzeichnung, die ein Anfänger des Web-Systems durch Herumtasten versucht hat, daher sollte es verschiedene Mängel in Inhalt und Beschreibung geben. \ # Ich würde es begrüßen, wenn Sie darauf hinweisen könnten.

App-Erstellung

Streamlit-Installation

Streamlit ist OSS. GitHub：https://github.com/streamlit/streamlit

Die Installation ist mit den folgenden Schritten in Ordnung.

pip install streamlit

Durch Ausführen des folgenden Befehls können Sie die Demo-App lokal starten und im Browser überprüfen (der Browser wird automatisch gestartet).

streamlit hello

Die offizielle Tutorial-Seite ist leicht zu verstehen. Dieser Kommentarartikel ist ebenfalls verfügbar.

[Zusatz] Dies ist auch hilfreich.

• [Python] Ich habe einen Test von "Streamlit" geschrieben, der das Erstellen einer Visualisierungsanwendung erleichtert

Datenaufbereitung

Es ist eine solche Zeit, also werden Sie sehen wollen, wie sich die neuen Koronamaßnahmen auf den Menschenstrom in Tokio auswirken. Als ich nach solchen Daten suchte, fand ich sie unter Yahoo! Data Solution. "Täglicher Übergang der geschätzten Bevölkerung in Tokio 23 Stationen (insgesamt / Besucher / Einwohner)" Daten Es wurde als offene Daten veröffentlicht (Stand: 10. April 2020). Dieses Mal werde ich versuchen, dies auf eine schöne Art und Weise zu visualisieren.

[Quelle: Yahoo! Data Solution (https://ds.yahoo.co.jp/report/, 2020/04/09)] Die Daten werden täglich aktualisiert. Hier werden die Daten bis zum 9. April 2020 verwendet.

Die Originaldaten liegen im Excel-Format vor und umfassen die Anzahl der Einwohner, Besucher und die Gesamtzahl der Personen in den 23 Bezirken Tokios täglich. Da dies für jeden Monat in einem separaten Blatt gespeichert wird, konvertieren Sie es im Voraus in CSV.

Lesen Sie jede davon und kombinieren Sie sie zu einer.

import numpy as np
import pandas as pd

data_02 = pd.read_csv('Tokyo 23 Ward Transition 0409_Februar.csv')
data_03 = pd.read_csv('Tokyo 23 Ward Transition 0409_März.csv')
data_04 = pd.read_csv('Tokyo 23 Ward Transition 0409_April.csv')

data_all = pd.concat([data_02, data_03.iloc[:, 2:], data_04.iloc[:, 2:]], axis=1)

data_all.head()

Bereiche und Zielklassifizierungen sind als MultiIndex und Ausgabe organisiert.

data_all.fillna(method='ffill', inplace=True)
data_all.set_index(['Bereich', 'Zielklassifizierung'], inplace=True)

data_all.to_csv('tokyo_0409.csv', index=True, header=True)

Die endgültigen Daten sehen so aus.

data_all.head(7)

Erstellen Sie ein Dashboard

Von hier aus erstellen wir tatsächlich ein Dashboard. Mit Streamlit können Sie ein Dashboard mit nur einem Python-Skript erstellen. Dieses Mal werde ich das Skript als streamlit_app.py schreiben.

Der Inhalt der Daten wird in einem Liniendiagramm angezeigt. Geben Sie das Zielgebiet im Auswahlfeld an und legen Sie eine Spezifikation fest, mit der Sie den Zeitreihenübergang der Anzahl der Einwohner, Besucher und der Gesamtzahl des Gebiets anzeigen können.

streamlit_app.py

import numpy as np
import pandas as pd
import streamlit as st
import plotly.graph_objects as go

st.title('Täglicher Übergang der geschätzten Bevölkerung in 23 Bezirken Tokios')
st.write('[Quelle: Yahoo Data Solution]')

data_all = pd.read_csv('data/tokyo_0409.csv')
erea_list = data_all['Bereich'].unique()

data_all.set_index(['Bereich', 'Zielklassifizierung'], inplace=True)

#Ändern Sie den Wert in vertikales Halten
data_all = data_all.T
#Konvertieren Sie das Datum in den Datum / Uhrzeit-Typ
data_all.index = map(lambda x: '2020'+x, data_all.index)
data_all.index = pd.to_datetime(data_all.index, format='%Y Jahr%m Monat%d Tag')
data_all.index.name = 'Zeit'

#Wählen Sie den Anzeigebereich mit dem Auswahlfeld aus
selected_erea = st.sidebar.selectbox(
    'Wählen Sie den anzuzeigenden Bereich aus:',
    erea_list
)

#Grafikanzeige
st.write(f'##Anzeige:{selected_erea}')
data_plotly = data_all[(selected_erea)]
data_plot = [
    go.Scatter(x=data_plotly.index,
               y=data_plotly['Bewohner'],
               mode='lines',
               name='Bewohner'),
    go.Scatter(x=data_plotly.index,
               y=data_plotly['Besucher'],
               mode='lines',
               name='Besucher'),
    go.Scatter(x=data_plotly.index,
               y=data_plotly['Das ganze'],
               mode='lines',
               name='Das ganze')]
layout = go.Layout(
    xaxis={"title": "Datum"},
    yaxis={"title": "Anzahl der Personen"}
)
st.plotly_chart(go.Figure(data=data_plot, layout=layout))

Verwenden der st.write () Methode des streamlit Moduls usw. Wir definieren die Zeichenfolgen, Tabellen und Grafiken, die auf dem Bildschirm angezeigt werden sollen.

Als interaktiver Prozess wird "st.selectbox ()" verwendet, um die Zielbereichsoptionen anzuzeigen. Indem der vom Benutzer in selected_erea ausgewählte Wert als Rückgabewert verwendet wird, Die Informationen des entsprechenden Bereichs werden in einem Diagramm gezeichnet. Sie können Elemente in der Seitenleiste auf der linken Seite des Bildschirms mit "st.sidebar" platzieren, und es sieht ein wenig gut aus.

Für die Diagrammanzeige stehen einfache Methoden wie "st.line_chart ()" zur Verfügung. Ich schien nicht in der Lage zu sein, mit Daten usw. umzugehen. Dieses Mal verwende ich st.plotly_chart (), um mit Plotly ein interaktives Diagramm zu erstellen und es zu zeichnen.

Ein weiteres charakteristisches Merkmal von Streamlit ist Sie können Daten auf der Karte mit st.map () zeichnen Mit st.progress () können Sie einen Fortschrittsbalken für Prozesse anzeigen, die lange dauern. Ich wollte diesen Bereich auch nutzen, aber dieses Mal werde ich ihn weglassen.

Es ist praktisch, einen Bildschirm mit nur einem kurzen Python-Skript erstellen zu können, ohne HTML zu kennen.

Bereitstellung in AWS

Bei angenommener Verwendung können Sie die vorliegenden Daten schnell überprüfen, die Ergebnisse mit dem Team teilen usw. Ich denke, es geht darum, aber da es eine große Sache ist, werde ich es auf einer AWS EC2-Instanz bereitstellen und als Test veröffentlichen.

Verfahren: 1: Erstellen Sie eine t2.micro-Instanz der kostenlosen AWS EC2-Schicht 2: Führen Sie die App in der Instanz aus

streamlit run streamlit_app.py

3: Domainerwerb Dieses Mal habe ich vom kostenlosen Domain-Service freenom einen entsprechenden Domain-Namen "onedata.ml" erhalten. (Sie können kostenlos ".tk" -, ".ml" -, ".ga" -, ".cf" -, ".gq" -Domains erhalten.) 4: Bearbeiten Sie die Streamlit-Konfigurationsdatei In der Konfigurationsdatei (config.toml) im Ordner ~ / .streamlit Geben Sie den Domainnamen ein, den Sie als Zugangsadresse erhalten haben.

[browser]
gatherUsageStats = false
serverAddress = "onedata.ml"

[server]
port = 8501

5: Portübertragung von 80 auf 8501 Standardmäßig akzeptiert streamlit die Kommunikation über Port 8501. Ich möchte vom Standardport 80 aus auf den Zugriff zugreifen können, ohne den Port anhand des Domänennamens angeben zu müssen. Dazu benötigen Sie Root-Rechte, wenn Sie die App ausführen. Daher werden wir uns hier damit befassen, indem wir mit iptables spielen und den Zugriff auf Port 80 an Port 8501 weiterleiten.

sudo iptables -t nat -A PREROUTING -p tcp --dport 80 -j REDIRECT --to-port 8501

6: Port 80 öffnen Bearbeiten Sie Sicherheitsgruppe> Eingehende Regeln im EC2-Dashboard und lassen Sie Port 80 offen.

Hier ist die App, die ich gemacht habe ↓ http://onedata.ml

Implementierung ↓ https://github.com/tkmz-n/streamlit_app

Zusammenfassung

Erstellen Sie eine einfache Demo-App, um offene Daten mit Streamlit zu visualisieren Ich habe versucht, es in AWS bereitzustellen und zu veröffentlichen.

Wenn wir uns die Daten ansehen, können wir sehen, dass der Verkehr der Menschen in den 23 Bezirken Tokios seit Ende März allmählich zurückgegangen ist. Bleiben wir weiterhin zu Hause, um die neue Corona so schnell wie möglich zusammenzuführen.