Wie man Google Charts mit 4D verwendet

Neurowissenschaftlern zufolge reagieren wir besser und schneller auf eine visuelle Form als auf jede andere Art der Darstellung. Deshalb sind Schaubilder und Diagramme eindeutig ein Schlüssel zum besseren Verständnis von Daten.

Wenn Sie also Balkendiagramme, Histogramme oder Tortendiagramme anzeigen möchten, die modern und vollständig kompatibel mit den führenden Browsern sind, aber auch der Art und Weise, wie das menschliche Gehirn Informationen verarbeitet, besser entsprechen, ist Google Charts eine mögliche Antwort. Die verfügbaren Diagrammtypen in Google Charts sind vielfältig: Neben den klassischen Balken-/Säulen-/Kuchendiagrammen bietet Google Charts auch ausgefeilte Diagramme wie Treemap, Candlestick und Gauge-Charts.

Dieser Blogbeitrag enthält ein Beispiel für ein Donut-, ein Karten- und ein Balkendiagramm. Jedes Diagramm zeigt die Bevölkerung nach Ländern in Südamerika an. In der folgenden Datenbank finden Sie die 4D-Methode, um die Daten abzurufen, sowie mehrere HTML-Dateien, um die verschiedenen Diagramme anzuzeigen.

Beispiel einer Datenbank

Datenformat

Diese Datenbank ist sehr einfach. Eine einzige Methode, GetJsonData, wird benötigt, um ein JSON-Datenarray zurückzugeben, das der Google Chart-Spezifikation entspricht.

In den drei folgenden Diagrammbeispielen ist das Datenformat das gleiche, wie unten gezeigt:

{
   "Data":[
      ["Country", "Population"],
      ["Argentina", 43847277],
      ["Bolivia", 10888402],
      ["Brazil", 209567920],
      ["Chile", 18131850],
      ["Colombia", 48654392],
      ["Ecuador", 16385450],
      ["Gabon", 1763142],
      ["Guyana", 77061],
      ["Paraguay", 6725430],
      ["Peru", 31774225],
      ["Suriname", 54761],
      ["Uruguay", 3444071],
      ["Venezuela", 31518855]
   ]
}

Donut-Diagramm

Das Donut-Diagramm-Beispiel finden Sie in der Datei „donutChart.html“ im WebFolder.

Weitere Informationen finden Sie in der Dokumentation zu Kreisdiagrammen von Google Charts.

Kartendiagramm

Ein Beispiel für ein Kartendiagramm finden Sie in der Datei „geoChart.html“ im WebFolder.

Weitere Informationen finden Sie in der Dokumentation zu Geodiagrammen von Google Charts.

Balkendiagramm

Das Beispiel für ein Balkendiagramm finden Sie in der Datei „barChart.html“ im WebFolder.

Weitere Einzelheiten finden Sie in der Dokumentation zu Balkendiagrammen von Google Charts.