Google Chart API

Man kann über Google so viel schwarzmalen wie man möchte, aber die immer neuen APIs sind immer wieder einfach besser als die Konkurrenz. Die nun offene Chart API ist da keine Ausname. Es ist die eierlegende Wollmilchsau geworden. Einst exklusives internes Tool für Google, steht es nun jedem Anwender offen, sofern man sich mit 50.000 Abfragen pro Tag begnügt.

Für diese Seite sind die Pie-Charts am interessantesten. Nach kurzem Lesen der Instruktionen, bekomme ich aus den alten Daten dieses Eintrags, sowas heraus:

Hierzu ein winziges kurzes Tutorial, das kurz die API erklären soll. Da diese Art von Diagrammen die sicherlich einfachsten der API sind, bietet sich mein Beispiel auch bestens an. Im Gegensatz zu anderen Google APIs braucht man hier keinen API Key, sondern arbeitet einzig und allein mit URLs. Jede URL baut sich aus mehreren Paramentern auf. Fangen wir mal einfach an mit einem einfacherem Diagramm:

Die URL für dieses Diagramm besteht aus 4 Parametern, die durch ein Ampersand-Symbol verbunden, in der URL an das API übergeben werden. Die Parameter hierfür lauten:

1. cht=p3
2. chs=468x242
3. chd=s:1cs
4. chl=Label-1|Label-2|Label-3

Zeile 1 definiert die Art des Diagramms. Zeile 2 beschreibt die Größe, alle Diagramme werden als normales Bild ausgegeben. Zeile 3 beschreibt die eigentlichen Werte und Zeile 4 schließlich die Beschriftung dieser Werte. Die URL umschreibt also: „Zeichne ein Diagramm der Art 3D Pie-Chart, in den Maßen 468 Pixel breit und 242 Pixel hoch. Gebe dem Diagramm 3 Werte – 53, 28, 19 – und beschrifte diese Werte mit Label-1, Label-2 und Label-3.“ Soweit so einfach.

Etwas abstrakter wird es bei der eigentlichen Beschreibung der Werte. Google bietet hier drei Methoden, alle umschreiben eine andere Art der Kodierung. Mein einfaches Beispiel funktioniert mit dem was Google als Simple Encoding betitelt und was der String chs= in der URL einleitet. Hier die Regeln zum Simple Encoding:

Upper case A = 0, B = 1 and so on to Z = 25.

Lower case a = 26, b= 27 and so on to z = 51.

Zero (0) = 52 and so on to 9 = 61.

Specify a missing value with an underscore (_).

If you have more than one set of data, separate each set with a comma (,).

Meine 3 Werte (53, 28, 19) werden in dieser Kodierung also als „1cs“ beschrieben.

1 = 53

c = 28

s = 19

Wer diesen Schritt einmal durchschaut hat, der hat das Schlimmste hinter sich. Viel mehr gibt es eigentlich nicht zu schreiben. Diese API ist äußerst einfach für diese simplen Diagramme. Komplexer wird es erst bei anderen Diagramm-Arten.

Neben dem dreidimensionalen Pie-Chart, gibt es natürlich auch die klassische zweidimensionale Variante:

Man darf das Ganze auch einfärben. Entweder mit einem Farbwert, welcher dann abgestuft wird:

Oder auch mit je einem separaten Farbwert für die einzelnen Abschnitte:

Kann nur jedem empfehlen sich die API mal näher anzuschauen. Glaube da wird man hier bei mir in Zukunft mehr von sehen. Daumen hoch für Google’s Chart API. Kleines aber feines Detail am Rande: Läd man eine dieser URLs für sich separat, dann ist das Favicon im Browser auch wirklich eine verkleinerte Ansicht des jeweiligen Diagramms.