Mit Google Diagramme erstellen und in Joomla! einbauen

Mit Google Diagramme erstellen und in Joomla! einbauen

Das man mit Google nicht nur Begriffe im Internet suchen kann, sollte sicher schon jedem aufgefallen sein. Mittlerweile gibt es schon duzende andere Anwendungen die von Google abgedeckt werden.

In diesem Artikel werden wir eine Karte in einen Joomla! Artikel einbauen.

Wer sich etwas in Quellcode schreiben (HTML o.a.) auskennt, sollte keine Mühe haben, sich mit ein paar Zeilen Code sein eigenes Diagramm zu erstellen.

Vergewissern Sie sich, dass Sie Ihren WYSWYG-Editor in Joomla deaktiviert haben. Dieser verhindert die automatische Anpassung des Quellcodes. Sonst ist es gut möglich, dass Ihnen der Editor den Code selber zusammenstreicht und dieser dann nicht mehr korrekt ausgegeben wird.

Auf der Webseite Google Chart API finden sie alle Tag’s, die sie für die Erstellung von Balken-, Punkt- oder Kuchendiagramme, Barcodes oder auch Landkarten etc. verwenden können. Nun gilt es nur noch die richtigen Teile (Tags) für Ihren Artikel zusammen zu setzen.

In unserem Beispiel werden wir eine Europa-Karte 420×210 Pixel gross zeichnen, wobei wir die Schweiz farblich hervorheben möchten. Die Erklärungen der Codeteile zu diesem Beispiel finden Sie hier.

Sie können den Code direkt in die Adresszeile Ihres Browsers eingeben. So sehen Sie gleich das Ergebnis, was dabei rauskommt. Zum Einbau in Ihre Joomla! Webseite verwenden Sie den HTML-Befehl für den Einbau eines Bildes:

<img src ="ihre Google API" alt="ihr Diagrammtitel"/>

Der komplette Google API-Code würde dann so aussehen:

<img src="http://chart.apis.google.com/chart?cht=t&chs=420x210&chd=s:Af9&
chco=ffffff,ff0000,660000&chld=CH&chtm=europe&chf=bg,s,EAF7FE"
alt="Europakarte: Hervorgehoben die Schweiz" />

(Hinweis: bitte entfernen Sie die Leerzeichen in den Tags, sie verhindern im Beispiel nur die Ausführung des Codes)

Das fertige Bild sollte dann so aussehen:
Europakarte: Hervorgehoben die Schweiz

Nach diesem Prinzip können Sie nun beliebige Grafiken in Ihre Webseite einbauen.