Google Chart API – wenn’s mal schnell gehen muss

Wer kennt das nicht. Man schreibt einen Artikel und will dort einige Diagramme unterbringen. Doch wie soll man da am besten vorgehen? Klar, man könnte sie Diagramme mit Excel erstellen lassen und diese dann als Grafik dem Artikel hinzufügen. Das ist jedoch mehr als unflexibel. In solchen Momenten ist Google Chart genau das richtige. Mit der API lassen sich sowohl Linien-, Balken-, Kreis- und andere Diagramme erstellen. Man muss lediglich die notwendigen Parameter übergeben. Wie das nun genau funktioniert erfahren Sie in diesem Artikel.

Ich wünsche Ihnen viel Spaß beim Lesen.

Um ein Diagramm zu erzeugen muss man lediglich die notwendigen Parameter an eine bestimmte URL übergeben. Dabei hängt es von Parameter ab, ob es zum Beispiel ein Balkendiagramm wird, oder ein anders. Normalerweise müssen mindestens vier Parameter übergeben werden: Die Größe der Grafik in Pixel, Diagramm-Typ, die einzelne Werte und die dazugehörige Beschriftungen. Diese Variablen werden an die API-URL angehängt: http://chart.apis.google.com/chart

Ich versuche Ihnen das Vorgehen am Beispiel der Firmenkantine zu erklären.

Stellen wir uns doch mal vor, dass die Köche jeden Tag immer sieben Gerichte kochen. Nun will der Geschäftsführer gerne wissen welches Gericht am besten bei den Angestellten ankommt. Die Zahlen werden gesammelt und sollen nun als ein Kreisdiagramm präsentiert werden. Bei der Aufwertung kam folgende Zahlen zustande:

Currywurst: 125
Hamburger: 23
Cheeseburger: 89
Schnitzel: 149
Vegetarisches: 29
Pizza: 102
Gemüsesuppe: 12

Diagramm-Titel
Man sollte natürlich jedem Diagramm einen Titel angeben. Das ist mit Google Chart auch ganz einfach möglich. Dazu müssen sie den Titel einfach mit der Variable „chtt“. Es gibt natürlich auch die Möglichkeit dem Titel eine andere Farbe und Größe zu geben. Diese Werte werden an die Variable  „chts“ angehängt. Wir möchten den Titel in Schriftgröße 18 und Farbe Blau haben: „chts=0000FF,18“

Diagrammgröße
Die Größe der Grafik wird mit der Variable „“ übergeben. Dabei ist die Maßeinheit wie üblich in Pixeln. Und die x- und y-Werte werden mit einem „x“ getrennt. So übergibt man, für eine 250×250 Pixel Grafik folgendes: „chs=800×350“

Diagramm-Typen
Der Typ hängt immer von dem Werde der Variable „cht“ ab. Dabei hat man bei jedem Typen noch mehrere Möglichkeiten zur Auswahl.  Der folgenden Tabelle können Sie die wichtigsten Werte, die mit der Variable übergeben werden können, entnehmen:

Weitere Diagramm-Typen von Google Chart.

Wir möchten für unser Beispiel ein zweidimensionales Kreisdiagramm verwenden, also übergeben wir „cht=p“.

Die Werte
Die Werte des Diagramms werden immer mit der Variabel „chd=t:“ übergeben. Dabei muss man beachten, dass die einzelnen Werte mit einem Komma getrennt werden müssten. Möchte man Werte mit x-Stellen nach dem Komma angeben, so benutzt man statt dem Komma einen Punkt. In unserem Beispiel sind es sieben Werte: „chd=t:125,23,89,149,29,102,12“.

Die Beschriftungen
Jetzt müssen wir nur noch die Beschriftungen der einzelnen Kuchenteile beschriften. Die sogenannten Labels werden mit der Variable „chl“ übergeben. Wichtig ist nur, dass die Reihenfolge der Beschriftungen der Reihenfolge der Werte entspricht. Dabei werden die Labels, anders als die Werte, mit einem „|“ getrennt. Dadurch wird es auch möglich ein Komme im Label zu nutzen. Bei unserem Beispiel müssen wir folgendes übergeben: „chl= Currywurst|Hamburger|Cheeseburger| SchnitzelVegetarisches|Pizza|Gemüsesuppe“

Ergebnis
Wenn Sie alle diese Schritte befolgen, so erhalten Sie zum Schluss folgendes Ergebnis:

http://chart.apis.google.com/chart?cht=p&chtt=Verteilung&chts=0000FF,18&chs=800×350&chd=t:125,23,89,149,29,102,12&chl=Currywurst|Hamburger|Cheeseburger| SchnitzelVegetarisches|Pizza|Gemuesesuppe

Beispiel-Diagramm mit Google Chart

Vorteile
Es kann praktisch von jedem sehr schnell und einfach ein Diagramm erstellt werden. Man benötigt keinerlei Software und man kann die Grafik relativ einfach dynamisch gestalten.

Ein weiterer Vorteil ist, dass die gesamten Berechnungen von Google übernommen werden. So wird auch der eigene Server geschont.

Und der wohl wichtigste Aspekt ist, dass es, anders als bei den meisten anderen Diensten von Google, keine Registrierung bedarf. Das heißt einfach gesagt, dass jeder jederzeit ein Diagramm erstellen kann.

Nachteile
Man ist immer von Google abhängig. Sollte der Server von Google versagen, oder Google den Dienst einstellen, so muss man alle Diagramme ersetzen.

Ein weiterer Nachteil sind die extrem langen URLs. Wie Sie selbst gesehen haben, erreichen diese extreme Längen. Und der Internet Explorer kann, z.B. maximal 2.048 Zeichen verarbeiten. Danach ist Schluss. Also sollte man aufpassen, dass diese Anzahl an Zeichen nicht über schritten wird.

Ich hoffe der Artikel hat Ihnen gefallen! Über Kommentare und Social Bookmarks würde ich mich sehr freuen.

ALL-INKL.COM

3 Kommentars zu dem Artikel “Google Chart API – wenn’s mal schnell gehen muss”

  1. Avatar von php0kid
    php0kid

    Nette Sache, aber meiner Meinung nach braucht man nicht noch mehr Elemente von Google in fremden Websites einbinden 😉
    Für solche Aufgaben gibt es im Bereich php beispielsweise jpgraph. Damit sind nicht nur Kuchendiagramme, sondern auch andere Diagramme (Balken, Linien, Punkte, ..) möglich!
    Google hat damit nur wieder eine weitere Möglichkeit zu erkennen, wo ihre Besucher denn nacheinander hingegangen sind 🙂 Schließlich senden wir auch bei Anfrage dieses Bildes Informationen mit.
    Nichts gegen die GoogleSuche, ich verwende sie schließlich auch, aber ich halte nicht so viel davon Google in noch mehr Bereichen dermaßen zu unterstützen.

    lG

  2. Avatar von StarSt0rm
    StarSt0rm

    Vielen Dank für dein Kommentar!
    Also du kannst auch mit Google Chart andere Diagramm-Typer erstellen, so ist es ja nicht. 😉 Aber jedem das seine. Ich habe nichts dagegen, wenn Google sowas erfährt.

  3. Avatar von Pascolo
    Pascolo

    Sehr interessant, vielen Dank für diese Information. Die API ist echt einsame spitze.