Der Zoom ist auf maps.google.com flüssiger als auf Google Maps API v3

8

Ich habe festgestellt, dass der Zoom auf maps.google.com sich anders verhält (besser: glatter) als meine benutzerdefinierte Karte mit der Version 3 von Die Google Maps API. Ich fand später heraus, dass dies auch für die Demo von Google hier gilt.

Gibt es eine Möglichkeit, mit Google Maps API v3 das gleiche gleichmäßige Zoom-Gefühl auf Karten zu erzielen?

Ich habe versucht, im Internet nach einer Lösung zu suchen, aber alles, was ich finden kann, sind Leute, die fragen, wie man Zoom-Animationen macht, was ich nicht suche.

    
a h 29.04.2015, 09:12
quelle

3 Antworten

11

Die native Google Maps-Website maps.google.com verwendet das HTML5-Canvas-Element zum Rendern Karten. Die Google Maps API Version 3 funktioniert nicht . Es ist derzeit (Stand Ende 2015) nicht möglich, das gleichmäßige kontinuierliche Zoom-Verhalten mit der Google Maps API zu erreichen.

Nachdem ich in Google Docs und im Web nach Antworten ohne Ergebnisse gesucht habe, brauchte ich etwas Zeit, um zu verstehen, wie die API v3 und wie maps.google.com im Grunde funktioniert und Karten anzeigen. Es gibt einen großen Unterschied, der sofort klarstellt, warum ein kontinuierlicher Zoom nicht mit der API funktioniert:

  1. Google Maps API v3 erstellt eine Karte aus Bildkacheln , die jeweils in einzelne <div /> -Container mit einer festen Standardgröße von 256 x 256 px gerendert werden. Beim Umschalten der Zoom-Ebene muss jede einzelne Kachel mit einem neuen Bild (von beliebigem Typ, möglicherweise dynamisch gestylt mit benutzerdefinierten Überlagerungen usw.) neu gerendert werden. Dies ist eine sehr teure Aufgabe, so dass jeder zusätzliche Zoom-Schritt zusätzliche Ressourcen zum Laden und zusätzliche Berechnungskosten zum erneuten Rendern der gesamten Szene über DOM-Manipulation hinzufügt. Ein flüssiges Zoom-Erlebnis ist selbst mit modernen Browsern auf hohen CPU / Speicher-Maschinen nahezu unmöglich.

  2. maps.google.com verwendet das HTML5 -Leinwandobjekt zum Rendern von Kartenszenen (ich bin mir ziemlich sicher, dass es eine API-v3-Fallback-Variante für alte Browser gibt ). Das Zeichnen in einem nativ unterstützten Canvas-Objekt ist wesentlich kostengünstiger als das Ersetzen von Bildern in DOM-Elementen. Google verwendet einen auf Vektorgrafiken basierenden Ansatz, der es ermöglicht, kontinuierlich ins Detail zu zoomen, ohne dass zusätzliche Ressourcen abgerufen werden müssen. Zusätzlich benötigte Informationen für eine bestimmte Zoomstufe könnten jedoch als kleinere Datenblöcke abgerufen und auf die Zeichenroutinen angewendet werden.

Ich muss zugeben, dass ich nicht weiß, wie das im Detail funktioniert. Es ist genau das, was ich entdeckt habe, als ich die Quelle untersucht habe und ich hoffe, dass es ziemlich genau erklärt, warum ein "glatter Zoom" derzeit nicht möglich ist, wenn man die Karten-API verwendet. Wie auch immer, freuen wir uns auf das Google Maps API v4 !

    
matthias 08.12.2015, 11:06
quelle
2

Es gibt noch weitere JavaScript-Zuordnungsbibliotheken, die ein sanftes Zoomen ermöglichen, wie Mapbox-GL und Cäsium. Beide verwenden WebGL, genau wie maps.google.com.

Ссылка

Ссылка

    
user1824681 24.03.2016 14:25
quelle
0

Ich denke, es hängt jetzt davon ab, ob sich Google Maps im Lite-Modus befindet, nach dem sie benannt zu sein scheinen Im Gegensatz zu den Canvas-basierten Karten sind das die alten, auf Bildkacheln basierenden Karten.

Gemäß der Google Maps-Dokumentation für System- und Browseranforderungen deaktiviert Google Maps 3D für bestimmte Grafikkarten. Bei einigen Grafikkarten geht es darüber hinaus und Sie können nur den Lite-Modus verwenden.

    
Andy 24.04.2017 16:17
quelle