CSS Garden

Tipps und Tricks ?ber Stylesheets

 

Google Maps und CSS

Bis jetzt nur mit IE6 und Firefox 1.5 getestet!

Ein Anfahrtsplan kann ganz legal in die eigene Homepage eingebunden werden. Verboten wird der Einsatz nur f?r illegale Handlungen wie zum Beispiel das Anzeigen von Banken, welche ohne grosse M?he ausgeraubt werden k?nnen.

Um solch eine Karten einzubinden brauchen sie lediglich einen Google Maps API Key (eindeutiger Schl?ssel). Um diesen zu l?sen, ben?tigen sie einen Google-Accout. Aber keine Angst, Sie m?ssen keine privaten Daten bekannt geben! Sind sie einmal soweit l?sst sich die Karte mit ein wenig Java-Script einbinden. Wie das funktioniert sehen Sie, wenn sie den Source dieser Seite betrachten. Ich habe mir M?he gegeben, den Code gut zu kommentieren und somit sollte es auch f?r einen Jawa-Neuling kein Problem sein das Skript umzusetzen.

Ist die Karte eingebunden k?nnen Sie so genannte "Marker" setzen. "Marker" sind Punkte auf der Karte welche besonders gekennzeichnet sind. Beim Klick auf so einen Punkt gibt es die M?glichkeit ein Infofenster anzuzeigen welches nach Lust und Laune mit HTML-Elementen best?ckt und nat?rlich mit CSS formatiert werden kann.

Der Link zur Dokumentation von Google Maps

Hier der CSS-Teil um das Info-Fenster zu formatieren:

Und hier der HTML-Teil:

Es soll aufgezeigt werden welche M?glichkeiten man mit der CSS-Formatierung hat. Ob die Liste im Info-Fenster sch?n ist und dazu passt, dar?ber l?sst sich nat?rlich streiten.

 

>Zurück

 

© 1997 - 2026