Wenn Sie bereit sind, hochwertige, individuelle Diagramme zu erstellen und zu versenden, sind Sie bereit für den Einstieg mit Image Charts.
Image Charts ist ein stets verfügbarer, stets aktueller Diagrammgenerierungsdienst, der die mühsame Arbeit der Erstellung und Aktualisierung wunderschöner eingebetteter Diagramme und Grafiken mit einer individuellen API für Sie übernimmt. Richten Sie es einmal ein und erzählen Sie die Geschichte Ihrer Daten mit automatisch aktualisierten, individuellen Diagrammen. Verschwenden Sie nie wieder Zeit mit langweiligen Grafiken.
Sehen Sie sich dieses Video für ein vollständiges Tutorial an oder scrollen Sie nach unten, um die Anleitung in schriftlicher Form zu sehen. Viel Spaß beim Erstellen von Diagrammen!
Wie Sie einen Diagramm-Endpoint auswählen
Es gibt 2 verschiedene Endpunkte bei Image Charts: /Chart und /Chart 2.8.0.
Obwohl die Schritte zur Nutzung beider sehr ähnlich sind, ist eine Variante entwicklerfreundlicher, während die andere für jeden zugänglicher ist.
Der Endpoint /Chart 2.8.0 richtet sich an Entwickler, die mit chart-js vertraut sind. Wenn Code nicht Ihr Ding ist, bietet Ihnen der Endpoint /Chart die Möglichkeit, dasselbe Maß an Individualisierung zu erreichen. Beide geben Ihnen Zugriff auf wunderschöne, eingebettete und automatisch aktualisierte Diagramme.
Wie Sie den /Chart 2.8.0-Endpoint verwenden
Der API-Endpoint /Chart 2.8.0 ist einfach, erfordert aber Kenntnisse der chart-js-Bibliothek.
Beginnen Sie einfach, indem Sie das Dropdown-Menü öffnen und /Chart 2.8.0 auswählen.
Von hier aus können Sie die Bibliothek chart-js verwenden, um Ihr Diagramm zu erstellen.
Wie Sie den /Chart-Endpoint verwenden
Der Endpoint /Chart richtet sich an alle, die weniger mit Programmieren vertraut sind oder einfach nur schnell und einfach ihre Diagramme erstellen möchten.
Alt-Text - Auswahl des Diagramm-Endpunkts
Sobald Sie Ihren Endpoint ausgewählt haben, folgen Sie diesen Schritten, um Ihr Diagramm zu erstellen
Erstellen Ihres individuellen eingebetteten Diagramms
Folgen Sie diesen Schritten, um Ihr individuelles eingebettetes Diagramm zu erstellen.
Diagramm auswählen
Stellen Sie zunächst sicher, dass /Chart im Dropdown-Menü ausgewählt ist. Schauen Sie dann oben auf Ihrem Bildschirm nach und wählen Sie Gallery aus. Hier wählen Sie ein Diagramm mit vorausgefüllten Daten aus, die Sie später bearbeiten können.
Alt-Text - Auswahl des Diagrammtyps
In Formularparametern bearbeiten
Sobald Ihr Diagrammtyp ausgewählt ist, kehren Sie zu Formularparameter im äußersten linken Tab oben auf dem Bildschirm zurück. Hier finden Sie die Blöcke, die zu Ihrem ausgewählten Diagramm gehören, bereits mit Testdaten gefüllt. (Denken Sie daran: Wenn Sie den Diagrammtyp wechseln möchten, gehen Sie einfach zurück zur Galerie.)
Ändern Sie einfach die Daten in den Blöcken auf der linken Seite, und das Diagramm wird automatisch aktualisiert. Außerdem können Sie hier den Namen Ihres Datensatzes ändern.
Hier können Sie zu Ihrem zweiten Datensatz scrollen und die Beschriftungen ändern. Weiter unten können Sie die Diagrammgröße in Pixeln ändern. Darunter können Sie den Diagrammtyp ändern, ohne Ihre Daten zu verlieren.
Darunter können Sie die X-Achse umbenennen.
Enterprise-Parameter (kostenpflichtige Funktion)
Für kostenpflichtige Tarife sehen Sie sich oben den Tab Enterprise-Parameter an. Hier schalten Sie den Enterprise-Modus ein.
Sobald diese Option aktiviert ist, können Sie die Schriftfamilie und die Syntax der Schriftfamilie bearbeiten sowie Bilder mit hoher Auflösung aktivieren.
Alt-Text - Aktivieren der Enterprise-Parameter
URL-Parameter
Um die URL-Parameter des von Ihnen erstellten Diagramms anzuzeigen, klicken Sie einfach oben auf dem Bildschirm auf die gleichnamige Registerkarte.
Umgebungen (kostenpflichtige Funktion)
Wenn Sie das On-Premise-Angebot von Image Charts nutzen, können Sie über die Registerkarte Umgebungen den Anfang der URL Ihres Diagramms steuern.
Klicken Sie einfach auf Neue Umgebung hinzufügen, bearbeiten Sie sie und speichern Sie. Der Standardwert ist „Production“.
Alt-Text - Hinzufügen einer Umgebung
Holen Sie sich die URL für E-Mails und Dokumente
Wählen Sie nun auf der rechten Seite Ihres Fensters „URL-Ausgabe" aus. Hier können Sie die bereitgestellte URL kopieren, um Ihr Diagramm einer E-Mail oder einem Dokument hinzuzufügen.
Holen Sie sich den HTML-Code zum Einbetten auf Websites.
Wenn Sie Ihr Diagramm auf Ihrer Website einbetten möchten, wählen Sie die HTML-Ausgabe. Verwenden Sie einfach den oberen Einbettungscode, um Ihr neues Diagramm auf Ihrer Website anzuzeigen.
Wer in Markdown einbettet, wählt den zweiten Code aus.
Wie man automatisch Diagramme in einer E-Mail mit Zapier erstellt
Für alle mit Enterprise-Abonnements, bietet Image Charts Zapier und Make Integration.
Hier zeigen wir, wie Sie einen Trigger und eine Aktion einrichten, um mit Zapier automatisch Diagramme in E-Mails zu erstellen.
Alt-Text - Image-Chart in Ihrem Posteingang
Diagrammdaten von überall abrufen
Beginnen Sie damit, die Quelle Ihrer Diagrammdaten auszuwählen. In diesem Beispiel verwenden wir Typeform.
Wählen Sie unter App-Ereignis Ihre Quelle aus. Dadurch werden die Formulardaten als Diagrammeingabe verwendet.
Trigger-Phase: App und Ereignis auswählen
Jedes Mal, wenn dieses Formular gesendet wird, wird automatisch ein Diagramm mit Image Charts erstellt.
Wähle dein Event aus und klicke auf Weiter.
Konto auswählen
Verbinden Sie Ihr Typeform-Konto (oder ein anderes Tool Ihrer Wahl) mit Zapier, indem Sie auf den Namen des Formulars klicken, das Sie verwenden möchten.
Klicken Sie auf Weiter.
Alt-Text - Einrichten des Typeform-Triggers
Trigger einrichten
Klicken Sie auch hier auf den Namen des gewünschten Formulars und fahren Sie fort.
Alt-Text - Auswahl des Formularnamens
Trigger testen
Hier können wir die Antworten überprüfen. Klicken Sie erneut auf Weiter.
Damit ist die Einrichtung von Typeform abgeschlossen, und jetzt richten wir Image Charts ein.
Alt-Text - Testen des Formular-Triggers
Aktionsphase: App und Ereignis auswählen
Hier wählen wir Image Charts als nächsten Schritt in der Automatisierung aus.
Wir wählen dann Erstellen Sie ein Chart.js-Diagramm im Dropdown-Menü.
Klicken Sie auf Weiter.
Alt-Text - Erstellen eines Chart.js-Diagrammtyps
Konto auswählen
Wählen Sie Ihr Image Charts-Konto aus. Hier geben Sie Ihre Image Charts-Anmeldedaten ein.
Aktion einrichten
Hier kopieren wir den gesamten Code der chart.js-Konfiguration mit Ausnahme des Datenblocks. Wählen Sie dann unter Version die Chart.js-Version 2.8.8 aus.
die Variablen Version, Diagrammbreite, Diagrammhöhe und Diagrammhintergrundfarbe sind in Image Charts voreingestellt. Geben Sie nun dieselben Werte in die entsprechenden Felder ein.
Klicken Sie auf Weiter.
Automatisierung testen
Sie sehen nun die URL Ihres Diagramms, die verwendet wird, um es in Ihre automatisierten E-Mails einzubetten.
Jetzt ist es Zeit, die Automatisierung zu testen. Wählen Sie Erneut testen & überprüfen.
Klicken Sie bei Erfolg auf Weiter.
Sende die ausgehende E-Mail mit Zapier
Email by Zapier hinzuzufügen ist der einfachste Weg, eine E-Mail mit eingebettetem Diagramm zu versenden. Sie können auch MailChimp, Gmail oder einen anderen E-Mail-Dienst verwenden.
Wählen Sie jetzt E-Mail von Zapier.
Senden Sie einen ausgehenden E-Mail-Trigger aus dem Dropdown-Menü der Ereignisse.
Klicken Sie auf Weiter.
Geben Sie hier Ihre Betreffzeile und den E-Mail-Text im Markup ein. Fügen Sie das zuvor erhaltene URL-Feld in den Text ein. Dadurch wird das Diagramm in Ihre E-Mail eingebettet. Wählen Sie einfach die URL aus dem Dropdown-Menü unter dem Text Ihrer E-Mail aus.
Fügen Sie Ihre Unterschrift hinzu und klicken Sie auf Weiter.
Die Automatisierung testen
Wählen Sie erneut „erneut testen & überprüfen".
Bei Erfolg können Sie nun die Automatisierung ausführen und Ihre brandneue automatisierte E-Mail mit dem eingebetteten Diagramm empfangen!
Hier ist ein Beispiel dafür, wie die E-Mail in Ihrem Posteingang aussehen wird:
Ein letztes Wort
So starten Sie mit Image Charts. Wagen Sie den Schritt, und testen Sie es noch heute kostenlos.
