Zuerst initialisieren Sie den Datenrahmen und das Dashboard. Ohne die Initialisierung des Dashboards wird im UI kein Dashboard angezeigt.

df = pd.DataFrame({

"Count": [0,0],

"Time": [0,0]

})

fig = px.line(df,x="Time",y="Count")

Dann erstellen Sie den ersten Tab. Dies ist eine Kombination aus einem App-Callback (um zu überprüfen, welcher Tab verwendet wird) und einer bedingten Funktion, um zu prüfen, welcher Tab derzeit ausgewählt ist. Der folgende Code erstellt nur das leere Dashboard und die UI-Elemente (wir werden später zum Ereignis-Tab kommen). Die dcc-Elemente sind die Dash Core Components und die HTML Components ermöglichen es, HTML einfach im UI zu nutzen.

html.H2('Analytics Dashboard'),

#Multi-select Dropdown

dcc.Dropdown(['Count Accepted','Count Admin Bounce','Count Block Bounce','Count Bounce','Count Clicked','Count Delayed', 'Count Delayed First','Count Delivered','Count Delivered First','Count Delivered Subsequent','Count Generation Failed', 'Count Generation Rejection','Count Hard Bounce','Count Inband Bounce','Count Initial Rendered','Count Injected', 'Count Out of Band Bounce', 'Count Policy Rejection','Count Rejected','Count Rendered','Count Sent','Count Soft Bounce', 'Count Spam Complaint','Count Targeted','Count Undetermined Bounce','Count Unique Clicked','Count Unique Confirmed Opened', 'Count Unique Initial Rendered','Count Unique Rendered','Count Unsubscribe','Total Delivery Time First','Total Delivery Time Subsequent', 'Total Message Volume'], id="y-axis", multi=True, searchable=True, placeholder="Select metrics(s)"),

#Datumsauswahl (maximal zulässiges Datum ist auf das heutige Datum gesetzt) dcc.DatePickerRange( id='date-picker-range', start_date=date(2022,1,1), end_date=date(2022, 2, 1), max_date_allowed=date(datetime.today().year,datetime.today().month,datetime.today().day), ),

#Grafikobjekt dcc.Graph( id='Emails', figure=fig )

Beachten Sie bei Dash, wie einfach es ist, eine Dashboard-UI mit einem Multi-Select, durchsuchbaren Dropdown zu erstellen. Um Multi-Select oder die Suche zu deaktivieren, können die Parameter zur Erstellung eines Dropdowns leicht modifiziert werden. Ich fand, dass der komplexeste Teil dieses Projekts darin bestand, den tatsächlichen Datenrahmen aus Eingaben zu erstellen sowie das HTML + CSS korrekt im UI zum Laufen zu bringen.

Die Time Series Metrics API ermöglicht das Abrufen von 33 individuellen Metriken basierend auf einem Datums-/Zeitbereich. Sie können tiefer nach Domains, Kampagnen, IP-Pools, sendenden Domains, Unterkonten filtern und die Präzision der zeitlichen Daten angeben. Diese zusätzlichen Filter zusammen mit Analysen zur Zustellbarkeit könnten eine zukünftige Verbesserung dieses Projekts darstellen (Fehlererkennung müsste für Klienten implementiert werden, die keinen Zugang zu Zustellbarkeitsanalysen haben).

Durch die Nutzung und den Aufruf der Metrics API habe ich ein Dashboard mit den vom Benutzer ausgewählten Parametern und dem angegebenen Zeitrahmen erstellt. Das initialisierte Dashboard wird dann aktualisiert.

#Erstellen des API-Aufrufs unter Nutzung der angegebenen Parameter params = { "from" : start_date + "T00:00", "to" : end_date + "T00:00", "delimiter" : ",", "precision" : "day", "metrics" : joined_values } api_url = BASE_URL + "/metrics/deliverability/time-series" response_API = requests.get(api_url, headers = {"Authorization" : API_KEY}, params=params) response_info = json.loads(response_API.text) new_df = pd.json_normalize(response_info, record_path=['results']) value_array = joined_values.split(",") #Erstellen eines neuen Dashboards unter Nutzung der neuen Metriken und Daten aus dem aktualisierten API-Aufruf fig = px.line(new_df, x=new_df['ts'], y=value_array, labels={"value": "Count", "variable": "Metric","ts":"Date"}) fig.update_xaxes(title_text="Time") fig.update_yaxes(title_text="Count") return fig

Im Folgenden ein Beispiel für mehrere ausgewählte Metriken und einen erweiterten Zeitrahmen.

Hinweis: Es gibt viele Elemente, die automatisch in das Dash-Diagramm eingebaut sind (Hover, Zoom, Autoskalierung).