Wer wissen moechte, wie man die Google Maps API verwendet und an die Koordinaten fuer den Google Code kommt findet hier die Loesung.
Will man z.B. in einem Kontaktformular eine Umgebungskarte des eigenen Standortes eingeben eigenet sich Google Maps hervorragend. Problem an der Sache ist nur, dass es nicht erlaubt ist einen Screenshot einzubinden und bei gewerblichem Einsatz muss die Google Maps API verwendet werden.
Als erstes registriert man sich unter http://code.google.com/intl/de/apis/maps/signup.html fuer einen API Code. Fuer jede Webseite (Domain) muss dabei ein neuer, eigener Key erstellt werden.
In die betreffende Seite fuegt man dann dieses kurze Javascript ein. Dabei beachten den eigenen Google -Maps API Key in der ersten Zeile bei DEIN-GOOGLE-API-KEY einzufuegen.
Beachtet ausserdem in der Funktion load() den Aufruf von GLatLng(). Die Xe muessen nachher durch die richtigen Koordinaten ersetzt werden.
<script src="http://maps.google.com/maps?file=api&v=2&key=DEIN-GOOGLE-API-KEY" type="text/javascript"></script> <script type="text/javascript"> //<![CDATA[ function load() { if (GBrowserIsCompatible()) { var map = new GMap2(document.getElementById("map")); var punkt = new GLatLng(xxx.xxxxxx,xxx.xxxxxx); map.setCenter(punkt, 16); map.addControl(new GSmallMapControl()); map.addControl(new GMapTypeControl()); var marke = new GMarker(punkt); map.addOverlay(marke); } } //]]> </script>
Wenn man den Zoom-Faktor der Karte aendern moechte, muss der zweite Wert bei setCenter() (bei mir 16) geaendert werden.
Dort wo auf der Seite nun die Karte erscheinen soll, wird dieser HTML Code eingefuegt.
<div id="anfahrt"> <div id="map" style="width: 500px; height: 350px"></div> </div>
Wenn ihr die Seite jetzt testet sollte bereits die Google Map erscheinen. Alles was jetzt noch fehlt sind die richtigen Koordinaten.
Dazu geht man am einfachsten auf www.multimap.com und gibt dort Strasse, Ort und gegebenenfalls das Land ein und erhaelt zwei Werte, die man dort einfuegt, wo im Script die Xe sind.
Fertig.
Kommentar schreiben