Ich entwickle eine iPhone App in html5 und mache den Build mit Phonegap. In der App gibt es eine Google-Karte mit benutzerdefinierten Markierungen. Die Art und Weise, wie die Markierungssymbole erstellt werden, lautet wie folgt:
%Vor%Die tatsächliche Größe der Symbole ist doppelt so groß wie die im Code definierten Größen. Dies wird gemacht, um sicherzustellen, dass die Symbole in hoher Auflösung auf dem Retina-Display angezeigt werden. Der obige Code funktionierte bis heute gut, aber was jetzt passiert, ist folgendes.
Wenn die Symbole Drop-down mit der Datei google.maps.Animation.DROP angezeigt werden, wird das Symbol in hoher Auflösung angezeigt. Wenn das Symbol jedoch auf der Karte landet, wechselt das Symbol zu einer niedrigen Auflösung Version.
Hat jemand schon einmal das Gleiche erlebt?
Danke ...
UPDATE Habe herausgefunden, dass wenn ich die Google Map Version wie folgt angeben:
%Vor%Also ich denke, es ist ein Fehler in der neuesten Goolge Map API.
Ich habe gerade auch dieses Problem gefunden. Der Fehler scheint in der neuesten Version (v3.7) seiner API zu liegen. Wenn Sie also v3.6 über den URL-Parameter "v = 3.6" angeben, funktioniert es einwandfrei.
Update: In Version 3.8+ (glaube ich) können Sie mit optimized: false ein Retina-Bild erzwingen, wenn Sie eines verwenden. Das liegt daran, dass "Optimized: True" alle Ihre Sprites übernimmt und zu einem Master-Sprite zusammenfügt. Dies bedeutet, dass Sie dies nur tun sollten, wenn Sie nur sehr wenige Marker haben. Es funktioniert auch nicht so gut mit Clusterer.
Der Standardwert ist nun optimiert: true, der zuerst bestimmt, ob das Gerät sogar so viele Symbole mit hoher Auflösung verarbeiten kann, bevor ein Master-Sprite mit einer höheren Auflösung erstellt wird. Laden Sie zum Beispiel eine Karte mit vielen Markierungen auf ein Retina Macbook Pro, und sie werden hochauflösend angezeigt, aber versuchen Sie ein iPhone 4 und es wird nicht. Wenn Sie das iPhone 4 mit optimized: false erzwingen und viele Marker haben, stottert es sehr. Nicht sicher über die 4S, aber ich nehme an, es wird wahrscheinlich die höhere Version verwenden, da es eine viel bessere Verarbeitungsfähigkeit hat.
Ich habe meine Lösung dafür gefunden, indem ich scaledSize
anstelle von size
verwende, um die Breite und Höhe des Bildes zu definieren.
Wenn Sie Icons wechseln, um die Auflösung zu verringern, liegt das daran, dass die Maps-API Canvas verwendet, um die Symbole zu rendern (und sie gruppieren und was nicht?), um die Benutzerfreundlichkeit zu erhöhen. Es handelt sich also technisch gesehen nicht um einen Bug, aber in bestimmten Browsern (wie zB älteren) gibt es fehlerhafte Dinge.
Aber es gibt eine Einstellung, die Sie in MarkerOptions
mit optimized: false
Verwenden Sie einfach ein Objekt mit den Attributen url
, size
und scaledSize
:
Dabei ist path/img/[email protected]
ein 60px
x 80px
PNG.
Die Eigenschaft Skalierte Größe ist die richtige, die von Google hier verwendet wird: Ссылка
Tags und Links html cordova google-maps html5