Von JSON bis Dashboard: Visualisierung von Duckdb -Abfragen in Stromleuchten mit Plotly

Bild von Editor | Chatgpt

# Einführung

Daten sind die wichtigste Ressource eines Unternehmens, und Einblicke aus Daten könnten den Unterschied zwischen Gewinn und Misserfolg ausmachen. Rohdaten sind jedoch schwer zu verstehen, daher visualisieren wir sie in Dashboards, sodass nichttechnische Menschen sich besser navigieren können.

Das Erstellen eines Armaturenbretts ist nicht einfach, insbesondere bei der Arbeit mit JSON -Daten. Glücklicherweise können viele Python -Bibliotheken kombiniert werden, um ein hilfreiches Software zu erstellen.

In diesem Artikel lernen wir, wie Sie ein Dashboard mit Streamlit und Plotly entwickeln, um Duckdb -Abfragen zu Daten aus einer JSON -Datei zu visualisieren.

Neugierig? Lassen Sie uns darauf eingehen.

# Dashboard -Entwicklung

Lassen Sie uns vor der Entwicklung unseres Dashboard ein wenig über die Instruments lernen, die wir verwenden werden.

Zunächst ist JSON oder JavaScript-Objektnotation ein textbasiertes Format zum Speichern und Übertragen von Daten mithilfe von Schlüsselwertpaaren und -Arrays. Es ist ein häufig verwendetes Format für APIs und Datenaustausch zwischen Systemen.

Nächste, Duckdb ist ein Open-Supply-RDBMS (Relational Database Administration System) für analytische Workloads. Es handelt sich um eine SQL-Datenbank (On-line Analytical Processing) in Course of, die direkt im Python-Prozess ausgeführt wird, ohne dass ein separater Server verwaltet werden muss. Es ist auch für die schnelle Ausführung optimiert, best für die Datenanalyse mit großen Datensätzen.

Straffung wird oft für die Dashboardentwicklung verwendet. Es ist ein Open-Supply-Framework für die Entwicklung interaktiver Daten-Webanwendungen mithilfe von Python. Um das Dashboard zu entwickeln, müssen wir HTML, CSS oder JavaScript nicht verstehen.

Wir werden auch verwenden Pandaseine leistungsstarke Bibliothek für Datenmanipulation und -analyse in Python.

Schließlich, Handlung ist eine Open-Supply-Bibliothek zur Entwicklung interaktiver Diagramme und Diagramme. Es kann in das Dashboard -Entwicklungsbibliotheken wie Streamlit integriert werden.

Das ist die grundlegende Erklärung der Instruments, die wir verwenden werden. Beginnen wir mit der Entwicklung unseres JSON -Dashboards. Wir werden die folgende Struktur verwenden. Versuchen Sie additionally, sie wie folgt zu erstellen.

JSON_Dashboard/
├── information/
│   └── pattern.json
├── app.py
└── necessities.txt

Füllen wir als nächstes die Dateien mit allen erforderlichen Informationen aus. Lassen Sie uns zunächst unsere JSON -Beispieldaten wie die folgenden haben. Sie können immer Ihre eigenen Daten verwenden, aber hier ist ein Beispiel, das Sie verwenden können.

(
  {"id": 1, "class": "Electronics", "area": "North", "gross sales": 100, "revenue": 23.5, "date": "2024-01-15"},
  {"id": 2, "class": "Furnishings", "area": "South", "gross sales": 150, "revenue": 45.0, "date": "2024-01-18"},
  {"id": 3, "class": "Electronics", "area": "East", "gross sales": 70, "revenue": 12.3, "date": "2024-01-20"},
  {"id": 4, "class": "Clothes", "area": "West", "gross sales": 220, "revenue": 67.8, "date": "2024-01-25"},
  {"id": 5, "class": "Furnishings", "area": "North", "gross sales": 130, "revenue": 38.0, "date": "2024-02-01"},
  {"id": 6, "class": "Clothes", "area": "South", "gross sales": 180, "revenue": 55.2, "date": "2024-02-05"},
  {"id": 7, "class": "Electronics", "area": "West", "gross sales": 90, "revenue": 19.8, "date": "2024-02-10"},
  {"id": 8, "class": "Furnishings", "area": "East", "gross sales": 160, "revenue": 47.1, "date": "2024-02-12"},
  {"id": 9, "class": "Clothes", "area": "North", "gross sales": 200, "revenue": 62.5, "date": "2024-02-15"},
  {"id": 10, "class": "Electronics", "area": "South", "gross sales": 110, "revenue": 30.0, "date": "2024-02-20"}
)

Als nächstes werden wir die füllen necessities.txt Datei mit den Bibliotheken, die wir für unsere Dashboard -Entwicklung verwenden.

streamlit
duckdb
pandas
plotly

Führen Sie dann den folgenden Code aus, um die erforderlichen Bibliotheken zu installieren. Es wird empfohlen, eine virtuelle Umgebung bei der Einrichtung der Umgebung zu nutzen.

pip set up -r necessities.txt

Sobald alles fertig ist, werden wir unser Dashboard entwickeln. Wir werden den Anwendungscode schrittweise untersuchen, damit Sie der Logik befolgen können.

Beginnen wir zunächst die erforderlichen Bibliotheken für unser Dashboard importieren.

import streamlit as st
import duckdb
import pandas as pd
import plotly.specific as px

Als nächstes werden wir die Verbindung einrichten, die wir brauchen, um sich zu duckdb zu machen.

@st.cache_resource
def get_conn():
    return duckdb.join()

Der obige Code wird die Duckdb -Verbindung zwischengespeichert, sodass das Streamlit -Dashboard bei der Wiederholung des Dashboards nicht wieder verbunden werden muss, was eine Leistungsverzögerung vermeidet.

Anschließend bereiten wir den Code vor, um die JSON -Daten mit dem folgenden Code zu lesen.

@st.cache_data
def load_data(path):
    df = pd.read_json(path, convert_dates=("date"))
    return df

Im obigen Code transformieren wir die JSON -Datei in ein Pandas DataFrame und zwischen den Daten zwischenstrahlen, damit wir sie nicht erneut lesen müssen, wenn sich der Filter ändert.

Nachdem das Laden und die Verbindung der Daten fertig sind, stellen wir eine Verbindung zu Duckdb her, um die JSON -Daten zu speichern. Sie können jederzeit den Datenort und den Tabellennamen ändern.

conn = get_conn()
df_full = load_data("information/pattern.json")
conn.execute("CREATE OR REPLACE TABLE gross sales AS SELECT * FROM df_full")

Im obigen Code registrieren wir die DataFrame als SQL -Tabelle benannt gross sales Inside Duckdb. Die Tabelle wird in jedem Wiederholungsverkauf aus dem Speicher aktualisiert, da wir keine Persistenz in einem separaten Skript einrichten.

Das ist alles für das Backend; Bereiten wir das stromlitische Dashboard vor. Bereiten wir zunächst den Dashboard -Titel und die Seitenleistenfilter vor.

st.title("From JSON to Dashboard: DuckDB SQL Visualizer")

st.sidebar.header("Filter Choices")
class = st.sidebar.multiselect("Choose Class:", df_full('class').distinctive())
area = st.sidebar.multiselect("Choose Area:", df_full('area').distinctive())
date_range = st.sidebar.date_input("Choose Date Vary:", (df_full('date').min(), df_full('date').max()))

Die obige Seitenleiste wird zu einem dynamischen Filter für die geladenen Daten, bei denen wir die SQL -Abfrage basierend auf diesen Filtern ändern können.

Wir erstellen dann die SQL -Abfrage gemäß den Filtern mit dem folgenden Code.

question = "SELECT * FROM gross sales WHERE TRUE"
if class:
    question += f" AND class IN {tuple(class)}"
if area:
    question += f" AND area IN {tuple(area)}"
question += f" AND date BETWEEN '{date_range(0)}' AND '{date_range(1)}'"

Die obige Abfrage ist dynamisch auf der Grundlage der Auswahl des Benutzers erstellt. Wir beginnen mit einem WHERE TRUE Bedingung zur Vereinfachung der Anhänge zusätzliche Filter mit AND.

Mit der Abfragegenerierung werden wir die Abfrage und die resultierenden Daten mit dem folgenden Code zeigen.

st.subheader("Generated SQL Question")
st.code(question, language="sql")

df = conn.execute(question).df()
st.subheader(f"Question Outcomes: {len(df)} rows")
st.dataframe(df)

Der obige Code zeigt die SQL -Abfrage zum Abrufen von Daten aus Duckdb und konvertiert das Ergebnis in ein Pandas DataFrame zum Anzeigen der gefilterten Tabelle.

Zuletzt werden wir die Plotly -Visualisierungen anhand der gefilterten Daten vorbereiten.

if not df.empty:
    col1, col2 = st.columns(2)

    with col1:
        st.markdown("### Scatter Plot: Gross sales vs Revenue by Area")
        scatter_fig = px.scatter(df, x="gross sales", y="revenue", colour="area", hover_data=("class", "date"))
        st.plotly_chart(scatter_fig, use_container_width=True)

    with col2:
        st.markdown("### Bar Chart: Whole Gross sales by Class")
        bar_fig = px.bar(df.groupby("class", as_index=False)("gross sales").sum(), x="class", y="gross sales", text_auto=True)
        st.plotly_chart(bar_fig, use_container_width=True)

    st.markdown("### Line Chart: Each day Gross sales Development")
    line_fig = px.line(df.groupby("date", as_index=False)("gross sales").sum(), x="date", y="gross sales")
    st.plotly_chart(line_fig, use_container_width=True)
else:
    st.warning("No information discovered for the chosen filters.")

Im obigen Code erstellen wir drei verschiedene Diagramme: ein Streudiagramm, ein Balkendiagramm und ein Zeilendiagramm. Sie können den Diagrammtyp jederzeit entsprechend Ihren Anforderungen wechseln.

Mit all dem Code werden wir den folgenden Befehl ausführen, um unser Streamlit -Dashboard zu starten.

Sie können jetzt auf das Dashboard zugreifen, das wie das Bild unten aussieht.

Die Diagramme sehen wie das Bild unten aus.

Da die Visualisierungen Plotly verwenden, können Sie sie interaktiv navigieren, wie in der folgenden Zeilenkarte gezeigt.

Das ist alles, was Sie wissen müssen. Sie können dem Dashboard immer mehr Komplexität verleihen und es sogar in Ihrem Unternehmen einsetzen.

# Abschluss

Daten sind die wertvollste Ressource, die ein Unternehmen haben kann, und die Visualisierung in einem Dashboard ist eine Möglichkeit für Geschäftsleute, Einblicke zu gewinnen. In diesem Artikel haben wir gelernt, wie man ein einfaches Dashboard mit Strom und Handlung entwickelt und gleichzeitig eine Verbindung zu Daten aus einer in Duckdb gespeicherten JSON -Datei herstellt.

Ich hoffe das hat geholfen!

Cornellius Yudha Wijaya ist ein Knowledge Science Assistant Supervisor und Datenautor. Während er in Vollzeit bei Allianz Indonesien arbeitet, liebt er es, Python- und Datentipps über soziale Medien und das Schreiben von Medien zu teilen. Cornellius schreibt über eine Vielzahl von KI- und maschinellen Lernthemen.