Erstellen interaktiver Data-Science-Anwendungen mit Python

Verwenden Sie Python, um ansprechende und interaktive Anwendungen zu erstellen, bei denen Benutzer Eingaben einreichen, Feedback erhalten und Multimedia-Elemente wie Bilder, Videos und Audio nutzen können.

Bei der Interaktion dreht sich alles um den Kontakt, das heißt, wie Sie Ihren Benutzern eine Geschichte erzählen, wie sie sie verstehen und wie sie sich darauf einlassen können. Menschen lieben es, Dinge mit ihren Augen zu sehen, sie lieben Projektionen, mit denen sie interagieren können.

Eine interaktive Anwendung ist eine Computersoftware, die entwickelt wurde, um Benutzer in eine aktive Interaktion einzubeziehen. Dies bedeutet, dass das Programm auf diese Aktionen reagiert, wenn ein Benutzer auf eine Schaltfläche klickt, Text eingibt oder ein Objekt auf dem Bildschirm bewegt. Es sieht aus wie ein Dialog, bei dem man eine Handlung ausführt und der Computer reagiert.

Eine interaktive Anwendung besteht aus diesen Hauptfunktionen: Benutzereingaben (wo Benutzer Daten oder Befehle eingeben können), Feedback (dies ist das Ergebnis der Benutzereingaben) und Multimedia-Elemente (z. B. Bilder, Videos und Audio, die zur Erstellung der Anwendung verwendet werden). Interaktion ansprechender).

Einige Beispiele für interaktive Anwendungen sind Lernsoftware, Social-Media-Anwendungen, Computervideospiele usw. Ein sehr gutes Beispiel für eine Computersoftware, die nicht interaktiv ist, ist ein Computerbildschirmschoner, der während der Ausführung keine Benutzerinteraktion erfordert.

Bibliotheken, die Interaktivität in der Datenwissenschaft bieten

Damals mussten Sie Ihre Data-Science-Anwendungen mit Flask präsentieren oder HTML, CSS und JavaScript lernen. Aber im Moment sind die Dinge seit der Einführung interaktiver Data-Science-Webbibliotheken viel besser und einfacher geworden. Diese Frameworks geben Datenwissenschaftlern die Flexibilität, interaktive Data-Science-Anwendungen zu erstellen, ohne sich mit dem Erlernen von Front-End-Technologien, dem Teilen von Datenanwendungen und der Bereitstellung befassen zu müssen Anwendungen in der Cloud nur mit der Programmiersprache Python.

Einige dieser Bibliotheken umfassen:

• Streamlit
• Gradio
• Bindestrich
• Panel

Streamlit

Streamlit ist ein Open-Source-Python-Framework, mit dem hochgradig interaktive Daten-Apps in nur wenigen Codezeilen erstellt werden können. Bei seiner Gründung im Jahr 2019 bestand sein Hauptzweck darin, Ihnen dabei zu helfen, sich auf das zu konzentrieren, was Ihnen am wichtigsten ist: Ihre Datenanalyse!

Optimieren Sie Funktionen durch die Umwandlung von Python-Skripten in Web-Apps, die gemeinsam genutzt werden können. Die Einfachheit von Streamlit macht es so beliebt. Die Verwendung der Streamlit-Bibliothek ist einfach und schnell, sodass Sie zum Erstellen von Daten-Apps keine Vorkenntnisse in der Webprogrammierung benötigen. Erfahren Sie hier mehr über Streamlit.

Obwohl Streamlit ein hervorragendes Tool ist, kann sein Nutzen je nach Situation unterschiedlich sein. Alle Ihre Anwendungen haben das gleiche Layout und den gleichen Stil, es sei denn, Sie sind bereit, HTML, JS und CSS zu erstellen, da Streamlit-Apps eher starre Designs und Erscheinungsbilder haben.

Gradio

Gradio ist ein Open-Source-Webframework, das die Erstellung von Anwendungen für maschinelles Lernen (ML) vereinfacht. Es erspart Entwicklern die Entwicklung von Front-End-Code und ermöglicht Ihnen die einfache Erstellung von Schnittstellen für ML-Modelle.

Entwickler verwenden Gradio, um Schnittstellen für text-, grafik- oder audiobasierte Modelle zu erstellen. Gradio unterstützt auch viele bekannte ML-Frameworks, darunter TensorFlow, PyTorch und Scikit-learn.

Gradio eignet sich eher für Demonstrationen des maschinellen Lernens, während Streamlit sich mehr auf die Erstellung von Daten-Dashboards konzentriert. Dies ist der Hauptunterschied zwischen den beiden Sprachen. Die Drag-and-Drop-Schnittstelle erleichtert das Erstellen benutzerdefinierter Eingabefelder und Ausgaben, und die integrierte Unterstützung für das Hosten und Teilen von Modellen für maschinelles Lernen vereinfacht den Bereitstellungsprozess.

Einige Gradio-Anwendungen scheinen ziemlich alt und veraltet zu sein. Daher müssen Sie wissen, wie man grundlegendes CSS schreibt, um sie anzupassen. Im Gegensatz zu Streamlit-Anwendungen, die als unabhängige Apps eine bessere Leistung erbringen, funktionieren Gradio-Apps am besten, wenn sie in eine andere Webseite eingebettet sind.

Bindestrich

Dash ist ein Open-Source-Framework zum Erstellen von Datenanwendungen mit Python, R oder Julia. Es ist ein großartiges Tool zum Erstellen datengesteuerter, interaktiver Dashboards und hat den Vorteil, dass es sich um ein Low-Code-Framework für die schnelle Entwicklung von Python-Datenanwendungen handelt.

Dash enthält einen HTML-Wrapper in Python zum Erstellen von Benutzeroberflächen, für dessen Verwendung sind jedoch noch HTML-Kenntnisse erforderlich. Der Einstieg ist auch nicht so einfach wie bei Streamlit, da es etwas komplexer ist (Sie müssen „Callbacks“ und etwas HTML verwenden).

Panel

Panel ist ein Open-Source-Python-Toolkit, das die Erstellung leistungsstarker Tools, Dashboards und komplexer Anwendungen nur mit Python erleichtern soll. Der breite Ansatz von Panel ermöglicht eine mühelose Verbindung mit dem PyData-Ökosystem und bietet gleichzeitig leistungsstarke, interaktive Datentabellen, Visualisierungen und vieles mehr, damit Sie Ihre Daten für produktive Arbeitsabläufe freischalten, analysieren, teilen und gemeinsam bearbeiten können.

Sein Funktionsumfang umfasst sowohl Callback-basierte APIs auf niedriger Ebene als auch reaktive APIs auf hoher Ebene, die es einfacher machen, komplexe, mehrseitige Apps mit viel Interaktivität zu erstellen und explorative Anwendungen schnell zu entwerfen.

Ähnlich wie alle verfügbaren Lösungen ermöglicht Panel das einfache Ausführen und Hosten Ihrer Apps vor Ort; Allerdings sind Sie bei der Bereitstellung in der Cloud auf sich allein gestellt. Sie bieten Anweisungen zu verschiedenen Bereitstellungsoptionen

Erstellen interaktiver Daten-Apps mit Streamlit

In diesem Abschnitt erstellen Sie ein voll funktionsfähiges und interaktives Dashboard, das die Visualisierungen und Daten der US-Bevölkerung für die Jahre 2010–2019 vom US Census Bureau zeigt.

Hier ist die Anwendungsdemo:

Hinweis: Wenn Sie die Anwendung testen möchten, können Sie sie sich hier ansehen. Wenn Sie jedoch einen Blick auf den Code werfen möchten, können Sie dies gerne tun um es hier anzusehen

Anforderungen

• Python 3.5+
• Streamlit pip install streamlit
• Pandas – für Datenanalyse und Datenverarbeitung
• Altair – das ist eine Python-Visualisierungsbibliothek
• Plotly Express – diese Bibliothek wird als High-Level-API zum Erstellen von Figuren verwendet

Datensatz

Der Datensatz des US Census Bureau, der für unser Dashboard verwendet wird, verfügt über drei wichtige Spalten (Bundesstaaten, Jahr und Bevölkerung), die als primäre Grundlage für unsere Messwerte dienen.

Das Bild unten zeigt, wie der Datensatz aussieht:

Importieren Sie die erforderlichen Bibliotheken

import streamlit as st
import pandas as pd
import altair as alt
import plotly.express as px

Konfigurieren Sie die Seite

Der nächste Schritt besteht darin, die Einstellungen der Anwendung festzulegen, indem ihr ein vom Browser angezeigter Seiten-Titel und ein Symbol zugewiesen werden. Damit legen Sie fest, wie die Seitenleiste bei Vergrößerung angezeigt wird und wie der Seiteninhalt in einem breiten Layout dargestellt wird, das der Breite der Seite entspricht.

Wir können das Farbthema des Altair-Plots anpassen, um es an das dunkle Farbschema der App anzupassen.

st.set_page_config(
    page_title="USA Population Trends",
    page_icon="🇺🇸",
    layout="wide",
    initial_sidebar_state="expanded")

alt.themes.enable("dark")

Daten importieren

Laden Sie den Datensatz mit Pandas in das Projekt.

population_data = pd.read_csv('data/us-population-census-2010-2019.csv')

Seitenleistenkonfiguration

Mit st.title() erstellen wir den App-Titel. Mit st.selectbox() erstellen wir Dropdown-Widgets, mit denen Benutzer ein bestimmtes Jahr und ein bestimmtes Farbthema auswählen können.

Danach werden die Daten für dieses Jahr mithilfe des chosen_year (aus den Jahren, auf die von 2010 bis 2019 zugegriffen werden kann) untergeordnet und in der App angezeigt. Mithilfe der chosen_palette können die Heatmap und die Choropleth-Karte entsprechend der vom oben genannten Widget bereitgestellten Farbe eingefärbt werden.

with st.sidebar:
    st.title('🇺🇸 USA Population Trends')
    
    available_years = list(population_data.year.unique())[::-1]
    
    chosen_year = st.selectbox('Choose a year', available_years)
    year_data = population_data[population_data.year == chosen_year]
    sorted_year_data = year_data.sort_values(by="population", ascending=False)

    palette_options = ['blues', 'greens', 'reds', 'purples', 'oranges', 'greys']
    chosen_palette = st.selectbox('Choose a color palette', palette_options)

Plot- und Diagrammtypen

Wir werden drei Diagramme verwenden, nämlich Heatmap, Choropleth-Karte und Donut-Diagramm. Definieren wir nun eine benutzerdefinierte Funktion zur Anzeige der verschiedenen Diagramme.

Heatmap

Die Funktion create_heat_map() wird verwendet, um die Heatmap der US-Bevölkerung für das Jahr 2010 – 2019 anzuzeigen.

# Heatmap
def create_heat_map(data, y_axis, x_axis, color_var, color_scheme):
    heat_map = alt.Chart(data).mark_rect().encode(
            y=alt.Y(f'{y_axis}:O', axis=alt.Axis(title="Year", titleFontSize=18, titlePadding=15, titleFontWeight=900, labelAngle=0)),
            x=alt.X(f'{x_axis}:O', axis=alt.Axis(title="", titleFontSize=18, titlePadding=15, titleFontWeight=900)),
            color=alt.Color(f'max({color_var}):Q',
                             legend=None,
                             scale=alt.Scale(scheme=color_scheme)),
            stroke=alt.value('black'),
            strokeWidth=alt.value(0.25),
        ).properties(width=900
        ).configure_axis(
        labelFontSize=12,
        titleFontSize=12
        )
    # height=300
    return heat_map

Hier ist die Ausgabe:

Choroplethenkarte

Die Funktion create_choropleth() zeigt eine farbige Karte der 52 US-Bundesstaaten für das ausgewählte Jahr an.

# Choropleth map
def create_choropleth(data, location_col, color_col, color_scheme):
    map_plot = px.choropleth(data, locations=location_col, color=color_col, locationmode="USA-states",
                               color_continuous_scale=color_scheme,
                               range_color=(0, max(year_data.population)),
                               scope="usa",
                               labels={'population':'Population'}
                              )
    map_plot.update_layout(
        template='plotly_dark',
        plot_bgcolor='rgba(0, 0, 0, 0)',
        paper_bgcolor='rgba(0, 0, 0, 0)',
        margin=dict(l=0, r=0, t=0, b=0),
        height=350
    )
    return map_plot

Hier ist die Ausgabe:

Donut-Diagramm

Das letzte Diagramm, das wir erstellen werden, ist ein Donut-Diagramm, das die prozentuale Migration jedes Staates zeigt. Bevor wir die Donut-Grafik erstellen, müssen wir die Bevölkerungsbewegungen von Jahr zu Jahr ermitteln.

# Donut chart
def create_donut(value, label, color):
    color_map = {
        'blue': ['#29b5e8', '#155F7A'],
        'green': ['#27AE60', '#12783D'],
        'red': ['#E74C3C', '#781F16'],
        'purple': ['#8E44AD', '#4A235A']
    }
    chart_colors = color_map.get(color, ['#F39C12', '#875A12'])
    
    data = pd.DataFrame({
        "Category": ['', label],
        "Percentage": [100-value, value]
    })
    background = pd.DataFrame({
        "Category": ['', label],
        "Percentage": [100, 0]
    })
    
    chart = alt.Chart(data).mark_arc(innerRadius=45, cornerRadius=25).encode(
        theta="Percentage",
        color= alt.Color("Category:N",
                        scale=alt.Scale(domain=[label, ''], range=chart_colors),
                        legend=None),
    ).properties(width=130, height=130)
    
    text = chart.mark_text(align='center', color="#29b5e8", font="Lato", fontSize=32, fontWeight=700, fontStyle="italic").encode(text=alt.value(f'{value} %'))
    background_chart = alt.Chart(background).mark_arc(innerRadius=45, cornerRadius=20).encode(
        theta="Percentage",
        color= alt.Color("Category:N",
                        scale=alt.Scale(domain=[label, ''], range=chart_colors),
                        legend=None),
    ).properties(width=130, height=130)
    return background_chart + chart + text

Ausgabe :

Bevölkerung in Text umwandeln

Der nächste Schritt besteht darin, eine benutzerdefinierte Funktion zur Verdichtung der Bevölkerungswerte zu entwickeln. Insbesondere wird die Darstellung der Werte auf der Kennzahlenkarte von 28.995.881 auf überschaubarere 29,0 M reduziert. Dies gilt für die Zahlen im Tausenderbereich.

# Convert population to text 
def format_population(number):
    if number > 1000000:
        if not number % 1000000:
            return f'{number // 1000000} M'
        return f'{round(number / 1000000, 1)} M'
    return f'{number // 1000} K'

# Calculation year-over-year population migrations
def compute_population_change(data, target_year):
    current_year = data[data['year'] == target_year].reset_index()
    previous_year = data[data['year'] == target_year - 1].reset_index()
    current_year['population_change'] = current_year.population.sub(previous_year.population, fill_value=0)
    return pd.concat([current_year.states, current_year.id, current_year.population, current_year.population_change], axis=1).sort_values(by="population_change", ascending=False)

Hier ist die Ausgabe:

Definieren Sie das App-Layout

Nachdem wir nun alle Teile fertig haben, fügen wir sie alle in der App zusammen, indem wir das App-Layout definieren. Beginnen Sie mit der Erstellung von 3 Spalten:

columns = st.columns((1.5, 4.5, 2), gap='medium')

Die Eingabeargumente (1.5, 4.5, 2) zeigen, dass die zweite Spalte die größte ist, mit einer Breite, die etwa dreimal so groß ist wie die der ersten Spalte.

Erste Spalte

Diese Spalte enthält die Kennzahlenkarte, auf der die Bundesstaaten mit der höchsten Zu- und Abwanderung für das ausgewählte Jahr angezeigt werden. Diese Spalte enthält auch das Ringdiagramm, das die Ein- und Auswanderung des Staates zeigt.

with columns[0]:
    st.markdown('#### Population Changes')

    population_change_data = compute_population_change(population_data, chosen_year)

    if chosen_year > 2010:
        top_state = population_change_data.states.iloc[0]
        top_state_pop = format_population(population_change_data.population.iloc[0])
        top_state_change = format_population(population_change_data.population_change.iloc[0])
        
        bottom_state = population_change_data.states.iloc[-1]
        bottom_state_pop = format_population(population_change_data.population.iloc[-1])   
        bottom_state_change = format_population(population_change_data.population_change.iloc[-1])   
    else:
        top_state = bottom_state = '-'
        top_state_pop = bottom_state_pop = '-'
        top_state_change = bottom_state_change = ''
    
    st.metric(label=top_state, value=top_state_pop, delta=top_state_change)
    st.metric(label=bottom_state, value=bottom_state_pop, delta=bottom_state_change)
    
    st.markdown('#### Migration Trends')

    if chosen_year > 2010:
        growing_states = population_change_data[population_change_data.population_change > 50000]
        shrinking_states = population_change_data[population_change_data.population_change < -50000]
        
        growth_percentage = round((len(growing_states)/population_change_data.states.nunique())*100)
        shrink_percentage = round((len(shrinking_states)/population_change_data.states.nunique())*100)
        growth_chart = create_donut(growth_percentage, 'Population Growth', 'green')
        shrink_chart = create_donut(shrink_percentage, 'Population Decline', 'red')
    else:
        growth_percentage = shrink_percentage = 0
        growth_chart = create_donut(growth_percentage, 'Population Growth', 'green')
        shrink_chart = create_donut(shrink_percentage, 'Population Decline', 'red')

    chart_columns = st.columns((0.2, 1, 0.2))
    with chart_columns[1]:
        st.write('Growth')
        st.altair_chart(growth_chart)
        st.write('Decline')
        st.altair_chart(shrink_chart)

Zweite Spalte

In der zweiten Spalte, der größten Spalte, werden die Choroplethenkarte und die Heatmap mithilfe benutzerdefinierter Funktionen angezeigt, die zuvor erstellt wurden.

with columns[1]:
    st.markdown('#### Total Population Distribution')
    
    choropleth = create_choropleth(year_data, 'states_code', 'population', chosen_palette)
    st.plotly_chart(choropleth, use_container_width=True)
    
    heat_map = create_heat_map(population_data, 'year', 'states', 'population', chosen_palette)
    st.altair_chart(heat_map, use_container_width=True)

Dritte Spalte

In der dritten Spalte werden die Top-Bundesstaaten angezeigt, wobei die Bevölkerung als farbiger Fortschrittsbalken angezeigt wird. Darunter wird auch ein About-Abschnitt hinzugefügt.

with columns[2]:
    st.markdown('#### State Rankings')

    st.dataframe(sorted_year_data,
                 column_order=("states", "population"),
                 hide_index=True,
                 width=None,
                 column_config={
                    "states": st.column_config.TextColumn(
                        "State",
                    ),
                    "population": st.column_config.ProgressColumn(
                        "Population",
                        format="%f",
                        min_value=0,
                        max_value=max(sorted_year_data.population),
                     )}
                 )
    
    with st.expander('Information', expanded=True):
        st.write('''
            - Data Source: [U.S. Census Bureau](https://www.census.gov/data/datasets/time-series/demo/popest/2010s-state-total.html)
            - :blue[**Population Changes**]: States with significant population increase/decrease for the selected year
            - :blue[**Migration Trends**]: Percentage of states with annual population change exceeding 50,000
            - Developed with Streamlit
            ''')

Ausführen der Anwendung

Um die Anwendung auszuführen, gehen Sie ganz einfach zu Ihrem Terminal und navigieren Sie zum Projektordner/-verzeichnis. Führen Sie diesen Befehl aus:

Streamlit run your_app_name.py

Die App wird in Ihrem Browser-Port 8501 (http://localhost:8501/) ausgeführt und geöffnet.

Stellen Sie Ihre App bereit

Nachdem Sie Ihre Anwendung erfolgreich erstellt haben, können Sie sie wie folgt bereitstellen:

1. Veröffentlichen Sie Ihre App in einem öffentlichen GitHub-Repository und stellen Sie sicher, dass sie über eine Datei „requirements.txt“ verfügt
2. Melden Sie sich bei share.streamlit.io an und verbinden Sie Ihren GitHub
3. Klicken Sie auf App bereitstellen und fügen Sie dann Ihre GitHub-URL ein
4. Klicken Sie auf „Bereitstellen“ und Ihre App wird innerhalb weniger Minuten in der Streamlit Community Cloud bereitgestellt
5. Kopieren Sie den Link Ihrer bereitgestellten App und teilen Sie ihn mit der Welt

Abschluss

Wir sind am Ende dieses Artikels angelangt, und wie Sie sehen, erreichen interaktive Datenanwendungen eine ganz neue Ebene und bringen mehr Interaktion und Verständnis in Datenanwendungen. Sie sind interessant und fesseln das Publikum.

Je mehr Interaktivität Sie Ihrer Data-Science-Anwendung hinzufügen, desto besser verstehen Ihre Benutzer den Wert, den Sie ihnen vermitteln.

Weitere Informationen finden Sie in den folgenden hilfreichen Ressourcen:

• Streamlit-Dokumentation
• Schalten Sie interaktive Datenwissenschaft mit Streamlit frei
• Streamlit 101: Die Grundlagen einer Python-Daten-App