So kombinieren Sie Streamlit, Pandas und Plotly für interaktive Daten -Apps

Bild von Autor | Chatgpt

Einführung

Das Erstellen interaktiver webbasierter Daten-Dashboards in Python ist einfacher als je zuvor, wenn Sie die Stärken von kombinieren StraffungAnwesend PandasUnd Handlung. Diese drei Bibliotheken arbeiten nahtlos zusammen, um statische Datensätze in reaktionsschnelle, visuell ansprechende Anwendungen umzuwandeln – alle, ohne einen Hintergrund in der Webentwicklung zu benötigen.

Es gibt jedoch einen wichtigen architektonischen Unterschied zu verstehen, bevor wir beginnen. Im Gegensatz zu Bibliotheken wie Matplotlib oder Seeborn, die direkt in Jupyter -Notebooks arbeiten, erstellt Streamlit eigenständige Webanwendungen, die aus der Befehlszeile ausgeführt werden müssen. Sie schreiben Ihren Code in eine textbasierte IDE wie VS-Code, speichern Sie ihn als a .Py -Dateiund führen Sie es mit streamlit run Filename.py. Diese Verschiebung von der Pocket book-Umgebung zur skriptbasierten Entwicklung eröffnet neue Möglichkeiten zum Teilen und Bereitstellen Ihrer Datenanwendungen.

In diesem praktischen Tutorial lernen Sie, wie Sie ein komplettes Verkaufs-Dashboard aufbauen können zwei klare Schritte. Wir beginnen mit der Kernfunktionalität mit nur Streamlit und Pandas und verbessern dann das Dashboard mit interaktiven Visualisierungen mithilfe von Plotly.

Aufstellen

Installieren Sie die erforderlichen Pakete:

pip set up streamlit pandas plotly

Erstellen Sie einen neuen Ordner für Ihr Projekt und öffnen Sie ihn in VS -Code (oder Ihrem bevorzugten Texteditor).

Schritt 1: Stromverschluss + Pandas Dashboard

Beginnen wir damit, ein funktionales Dashboard mit nur Stromversorgung und Pandas zu erstellen. Dies zeigt, wie streamlit interaktive Internet -Schnittstellen erstellt und wie Pandas die Datenfilterung umgeht.

Erstellen Sie eine Datei aufgerufen STEP1_Dashboard_Basic.py:

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

# Web page config
st.set_page_config(page_title="Primary Gross sales Dashboard", structure="broad")

# Generate pattern information
np.random.seed(42)
df = pd.DataFrame({
    'Date': pd.date_range('2024-01-01', intervals=100),
    'Gross sales': np.random.randint(500, 2000, dimension=100),
    'Area': np.random.alternative(('North', 'South', 'East', 'West'), dimension=100),
    'Product': np.random.alternative(('Product A', 'Product B', 'Product C'), dimension=100)
})

# Sidebar filters
st.sidebar.title('Filters')
areas = st.sidebar.multiselect('Choose Area', df('Area').distinctive(), default=df('Area').distinctive())
merchandise = st.sidebar.multiselect('Choose Product', df('Product').distinctive(), default=df('Product').distinctive())

# Filter information
filtered_df = df((df('Area').isin(areas)) & (df('Product').isin(merchandise)))

# Show metrics
col1, col2, col3 = st.columns(3)
col1.metric("Whole Gross sales", f"${filtered_df('Gross sales').sum():,}")
col2.metric("Common Gross sales", f"${filtered_df('Gross sales').imply():.0f}")
col3.metric("Information", len(filtered_df))

# Show filtered information
st.subheader("Filtered Information")
st.dataframe(filtered_df)

Lassen Sie uns die hier verwendeten wichtigen Stromversorgungsmethoden aufschlüsseln:

• St.Set_Page_Config () Konfiguriert den Registerkarte und Format des Browsers
• St.SideBar Erstellt das linke Navigationspanel für Filter
• St. Multiselect () Generiert Dropdown -Menüs für Benutzerauswahl
• St.Columns () Erstellt nebeneinander Layoutabschnitte
• St.Metric () Zeigt große Zahlen mit Etiketten an
• St.Dataframe () Rendert interaktive Datentabellen

Diese Methoden verarbeiten automatisch Benutzerinteraktionen und lösen App -Updates, wenn sich die Auswahl ändert.

Führen Sie dies von Ihrem Terminal aus (oder integriertes Terminal des VS -Codes) aus:

streamlit run step1_dashboard_basic.py

Ihr Browser wird sich öffnen http: // localhost: 8501 Zeigen Sie ein interaktives Dashboard.

Versuchen Sie, die Filter in der Seitenleiste zu ändern – beobachten Sie, wie die Metriken und die Datentabelle automatisch aktualisieren! Dies zeigt die reaktive Natur von stromloses Kombination mit den Datenmanipulationsfunktionen von Pandas.

Schritt 2: Fügen Sie Plotly für interaktive Visualisierungen hinzu

Lassen Sie uns nun unser Dashboard verbessern, indem wir die interaktiven Diagramme von Plotly hinzufügen. Dies zeigt, wie alle drei Bibliotheken nahtlos zusammenarbeiten. Erstellen wir eine neue Datei und rufen Sie sie an STEP2_Dashboard_Plotly.py:

import streamlit as st
import pandas as pd
import plotly.categorical as px
import numpy as np

# Web page config
st.set_page_config(page_title="Gross sales Dashboard with Plotly", structure="broad")

# Generate information
np.random.seed(42)
df = pd.DataFrame({
    'Date': pd.date_range('2024-01-01', intervals=100),
    'Gross sales': np.random.randint(500, 2000, dimension=100),
    'Area': np.random.alternative(('North', 'South', 'East', 'West'), dimension=100),
    'Product': np.random.alternative(('Product A', 'Product B', 'Product C'), dimension=100)
})

# Sidebar filters
st.sidebar.title('Filters')
areas = st.sidebar.multiselect('Choose Area', df('Area').distinctive(), default=df('Area').distinctive())
merchandise = st.sidebar.multiselect('Choose Product', df('Product').distinctive(), default=df('Product').distinctive())

# Filter information
filtered_df = df((df('Area').isin(areas)) & (df('Product').isin(merchandise)))

# Metrics
col1, col2, col3 = st.columns(3)
col1.metric("Whole Gross sales", f"${filtered_df('Gross sales').sum():,}")
col2.metric("Common Gross sales", f"${filtered_df('Gross sales').imply():.0f}")
col3.metric("Information", len(filtered_df))

# Charts
col1, col2 = st.columns(2)

with col1:
    fig_line = px.line(filtered_df, x='Date', y='Gross sales', shade="Area", title="Gross sales Over Time")
    st.plotly_chart(fig_line, use_container_width=True)

with col2:
    region_sales = filtered_df.groupby('Area')('Gross sales').sum().reset_index()
    fig_bar = px.bar(region_sales, x='Area', y='Gross sales', title="Whole Gross sales by Area")
    st.plotly_chart(fig_bar, use_container_width=True)

# Information desk
st.subheader("Filtered Information")
st.dataframe(filtered_df)

Führen Sie dies von Ihrem Terminal aus (oder integriertes Terminal des VS -Codes) aus:

streamlit run step2_dashboard_plotly.py

Jetzt haben Sie ein komplettes interaktives Dashboard!

Die Diagramme für Handlung sind vollständig interaktiv – Sie können über Datenpunkte schweben, bestimmte Zeiträume vergrößern und sogar auf Legendelemente klicken, um Datenreihen anzuzeigen/auszublenden.

Wie die drei Bibliotheken zusammenarbeiten

Diese Kombination ist leistungsstark, weil jede Bibliothek das umgeht, was sie am besten kann:

Pandas verwaltet alle Datenvorgänge:

• Erstellen und Laden von Datensätzen
• Filterungsdaten basierend auf Benutzerauswahlen
• Daten für Visualisierungen aggregieren
• Umgang mit Datenumwandlungen

Straffung Bietet die Webschnittstelle:

• Erstellt interaktive Widgets (Multiselect, Sliders usw.)
• Weitere die gesamte App erneut, wenn Benutzer mit Widgets interagieren
• Behandelt das reaktive Programmiermodell
• Verwaltet das Format mit Spalten und Containern

Handlung erstellt reichhaltige, interaktive Visualisierungen:

• Diagramme, die Benutzer schweben, zoomen und erkunden können
• Professionelle Diagramme mit minimalem Code
• Automatische Integration in die Reaktivität von Streamlit

Schlüsselentwicklungsworkflow

Der Entwicklungsprozess folgt einem einfachen Muster. Schreiben Sie zunächst Ihren Code in VS -Code oder einem Texteditor und speichern Sie ihn als .Py -Datei. Führen Sie als nächstes die Anwendung von Ihrem Terminal aus streamlit run Filename.pywas Ihr Dashboard in einem Browser öffnet http: // localhost: 8501. Während Sie Ihren Code bearbeiten und speichern, erkennt Streamlit automatisch Änderungen und bietet die Anwendung an. Sobald Sie mit Ihrem Dashboard zufrieden sind, können Sie es über die streamlit Group Cloud bereitstellen, um sie mit anderen zu teilen.

Nächste Schritte

Probieren Sie diese Verbesserungen aus:

Fügen Sie echte Daten hinzu:

# Substitute pattern information with CSV add
uploaded_file = st.sidebar.file_uploader("Add CSV", kind="csv")
if uploaded_file:
    df = pd.read_csv(uploaded_file)

Beachten Sie, dass echte Datensätze die für Ihre Datenstruktur spezifischen Vorverarbeitungsschritte erfordern. Sie müssen Spaltennamen anpassen, fehlende Werte verarbeiten und die Filteroptionen so ändern, dass sie Ihren tatsächlichen Datenfeldern entsprechen. Der Beispielcode enthält eine Vorlage, aber jeder Datensatz hat einzigartige Anforderungen für die Reinigung und Vorbereitung.

Weitere Diagrammtypen:

# Pie chart for product distribution
fig_pie = px.pie(filtered_df, values="Gross sales", names="Product", title="Gross sales by Product")
st.plotly_chart(fig_pie)

Sie können eine Ganze nutzen Galerie von Plotlys Grafikfunktionen.

Bereitstellen Ihres Dashboards

Sobald Ihr Dashboard lokal funktioniert, ist es unkompliziert, es mit anderen durch die streamlite Group -Cloud zu teilen. Drücken Sie zunächst Ihren Code in ein öffentliches Github -Repository und stellen Sie sicher, dass a einbezogen werden Anforderungen.txt Dateiauflistung Ihrer Abhängigkeiten (streamlit, pandas, plotly). Dann besuchen Sie https://streamlit.io/cloudMelden Sie sich mit Ihrem Github -Konto an und wählen Sie Ihr Repository aus. Streamlit erstellt und bereitstellt Ihre App automatisch und bereitet eine öffentliche URL bereit, auf die jeder zugreifen kann. Die kostenlose Stufe unterstützt mehrere Apps und behandelt angemessene Verkehrsladungen, wodurch es perfekt ist, um Dashboards mit Kollegen zu teilen oder Ihre Arbeit in einem Portfolio zu präsentieren.

Abschluss

Die Kombination von Stromlit, Pandas und Plotly verwandelt die Datenanalyse aus statischen Berichten in interaktive Webanwendungen. Mit nur zwei Python -Dateien und einer Handvoll Methoden haben Sie ein komplettes Dashboard erstellt, das teure Enterprise Intelligence -Instruments enthält.

Dieses Tutorial zeigt eine signifikante Verschiebung, wie Datenwissenschaftler ihre Arbeit teilen können. Anstatt statische Diagramme zu senden oder Kollegen zu verpflichten, Jupyter -Notizbücher auszuführen, können Sie jetzt Webanwendungen erstellen, die jeder über einen Browser verwenden kann. Der Übergang von der Pocket book-basierten Analyse zu skriptbasierten Anwendungen eröffnet Datenfachleuten neue Möglichkeiten, ihre Erkenntnisse zugänglicher und wirkungsvoller zu gestalten.

Überlegen Sie, wie interaktive Dashboards mit diesen Instruments mit diesen Instruments fortgesetzt werden können. Die gleichen Prinzipien, die Sie hier gelernt haben, skalieren Sie, um echte Datensätze, komplexe Berechnungen und ausgefeilte Visualisierungen zu verarbeiten. Unabhängig davon, ob Sie Government Dashboards, explorative Datenwerkzeuge oder Kundenanwendungen erstellen, bietet diese Drei-Bibliothek-Kombination eine solide Grundlage für professionelle Datenanwendungen.

Vinod wurde in Indien geboren und ist in Japan aufgewachsen. Er bringt eine globale Perspektive in die Bildung von Datenwissenschaft und maschinellem Lernen. Er überbrückt die Lücke zwischen aufstrebenden KI -Technologien und der praktischen Umsetzung für Berufstätige. Vinod konzentriert sich darauf, zugängliche Lernwege für komplexe Themen wie Agenten -KI, Leistungsoptimierung und KI -Engineering zu erstellen. Er konzentriert sich auf praktische Implementierungen für maschinelles Lernen und Mentoring der nächsten Era von Datenfachleuten durch Reside -Sitzungen und personalisierte Anleitung.