So behalten Sie statische Google Map-Bilder in einer flüssigen / reaktionsfähigen Dimension bei

8

Ich habe viel darüber gegoogelt, konnte aber keine nennenswerte Meinung dazu finden,

Ich muss ein statisches Google-Kartenbild in ein jQuery Mobile-Projekt integrieren, um eine App mit Phonegap zu erstellen. Das Kartenbild muss den Darstellungsbereich fast vollständig ausfüllen. Frage ist wie, wie es offenbar über verschiedene Geräte unterschiedlicher Bildschirmgröße geöffnet wird. Ich habe es mit dem prozentualen Ansatz versucht, aber das funktioniert hier sicher nicht.

Ich möchte eine Anleitung erhalten, wie das Layout für das statische Google-Map-Bild möglichst einfach in einem flüssigen Layout gehalten werden kann (bitte, wenn möglich).

Danke

    
Learner Always 11.11.2013, 10:22
quelle

3 Antworten

5

Laden Sie die größte Bildgröße, die Sie anfangs benötigen, in einen Container, z. Größe von 380 x 250

Dies wird Position sein: Relativ mit Überlauf versteckt und maximale Größe, die Sie brauchen.

%Vor%

Dann positioniere den using top & amp; links, um das Bild zentral im Container zu positionieren.

z.B.

%Vor%     
user2292370 29.01.2014 16:02
quelle
4

Ich habe versucht, Google Static Map so zu gestalten, dass Sie dem Bootstrap folgen, indem Sie auf diese Website verweisen Ссылка

index.html

%Vor%

css

%Vor%

Die statische Karte reagiert jetzt auf meiner Website. Ich bin mir nicht sicher, ob es auf dich zutrifft, aber so mache ich es.

    
Eddy Goh 02.03.2016 16:33
quelle
1

Sie können ein intermediäres Plug-in wie Picturefill verwenden, mit dem Sie jedem Benutzer ein entsprechendes Bild je nach den unterschiedlichsten Bedingungen wie Bildschirmgröße, Größe des Darstellungsbereichs, Bildschirmauflösung und mehr bereitstellen können.

Ссылка

Verwendung:

%Vor%
    
Yanga 23.03.2017 03:46
quelle