Google Maps mit neuem Zoom Feature
Google Maps hat vor einigen Tagen ein neues Update der Google Maps API veröffentlicht mit dem es nun möglich ist den Doppelklick der linken Maustaste als Center und Zoom Anweisung zu nutzen.
Für den Internet Explorer sowie dem Firefox, die unter Windows laufen, kann zudem ein “weiches” durchgängiges Zoomen angeschaltet werden. Dies bewirkt, dass das Zoomen nicht mehr abgehackt sondern leicht animiert ist.
Um das neue Verhalten anzutesten einfach im folgenden Google Maps Ausschnit wild herumklicken. Mit Doppelklick wird die gewählte Stelle zentriert und gleichzeitg hereingezommt. Wie schon erwähnt, sollte im Browser unter Windows ein durchgängiges Zoomen gesehen werden.
Diese beiden Features sind ab der API Version 2.58 verfügbar. Daher reicht es nun nicht mehr aus bei der GMap API Key Angabe nur die Version 2 anzugeben sondern es muss explizit Version 2.58 (&v=2.58;)gesetzt werden.
<script src="http://maps.google.com/maps?file=api&v=2.58&key=AB..."></script>
Die beiden neuen Zoom Eigenschaften werden bei dem Erstellen eines GMap2 Objektes durch die Methoden enableDoubleClickZoom() und enableContinuousZoom() aktiviert. Dazu bestehen noch die Methoden disable..() sowie Methoden um abzufragen ob dieses Feature aktiviert ist. Für die Beschreibung der Methoden sei auf die Google Maps API Dokumenation verwiesen.
Der gesamte JavaScript Code, um diesen Google Maps Ausschnit mit Zoom Feature zu erstellen, lautet wie folgt:
function load(){ if (GBrowserIsCompatible()) { map = new GMap2(document.getElementById("divGMap")); // Lat. and Long. of the one and only city Mainz =) var centerPosition = new GLatLng(50.01171396344054, 8.24985533952713); map.setCenter(centerPosition, 10); // enable double click zoom map.enableDoubleClickZoom(); // enable continuous zoom (Feature for IE and FF on Windows) map.enableContinuousZoom(); map.addControl(new GLargeMapControl()); map.setMapType(G_HYBRID_MAP); map.addControl(new GMapTypeControl()); } }
Hier der Vollständigkeit wegen noch der Html Ausschnit, der die JavaScript Methode load() aurfuft und den div Kontainer für die Google Map bereitstellt.
<div id="divGMap" style="width:490px;height:340px;border:1px solid black;"> Google map </div> <script type="text/javascript"> load(); </script>
Die Html Seite kann auch direkt hier aufgerufen werden, falls einem das am Herzen liegt.
