2013-12-19 11 views
17

Ich verwende den neuen Google maps Einbettungscode (iFrame), um eine kleine Karte zu meiner Website hinzuzufügen, aber ich kann das neue Adressfeld in der oberen linken Ecke nicht verbergen (siehe Bild) unten).Google Maps Einbetten - Entfernen Ortskarte

http://i.imgur.com/JOVXkra.jpg

Ich habe die Karte Code erzeugt, indem die „Karte teilen und einbetten“ Option klicken (siehe Bild unten), aber ich frage mich, wenn ich die volle API verwenden muß, um dies zu erreichen.

http://i.imgur.com/xxl25Ga.png

Alle Ressourcen bespreche ich bisher gefunden habe nur die alte Version Einbettung und das Informationsfeld zu deaktivieren, die nicht die gleiche ist, und der einzige Hinweis, ich habe ist, dass die HTML-Klasse Die Box heißt "Platzkarte", aber die Suche bringt mir immer noch nichts.

Jede Hilfe oder Punkt in die richtige Richtung würde sehr geschätzt werden.

Danke!

+0

ist eine umfassendere Diskussion: http://stackoverflow.com/questions/11334042/google-maps-removing-controls – harvest316

+0

Super-spät, aber hier ist eine andere Möglichkeit, es zu entfernen. http://Stackoverflow.com/a/37083353/3130549 – rawnewdlz

+0

Das ist großartig, danke. Wenn Sie die gleiche Antwort hier hinzufügen, akzeptiere ich sie als die richtige Antwort. – Sintyche

Antwort

27

Sie können alle Schaltflächen mit CSS ausblenden. Erstellen Sie einen Container-div-Breitenüberlauf auf ausgeblendet und die Größen, die Sie benötigen. Legen Sie die neuen Google Maps iframe/einbetten mit einer größeren Größe. So positionieren Sie iframe die Karten verwenden negativ marges ..

Beispiel mit 100% Breite:

<div style="width: 100%; overflow: hidden; height: 300px;"> 
    <iframe 
    src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d39797.07748547086!2d5.46683904751879!3d51.433965676849986!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c6d90575ca5e3d%3A0x55989f5f344b006!2sPrins+Hendrikstraat+5!5e0!3m2!1snl!2snl!4v1392716144537" 
    width="100%" 
    height="600" 
    frameborder="0" 
    style="border:0; margin-top: -150px;"> 
    </iframe> 
</div> 

Machen Sie den iframe 300px höher ist als Ihre Container Div. 150px zum verstecken und 150px zum verstecken oben. Um diese 150 auf der Oberseite des iFrame zu verbergen, verwenden Sie:

margin-top: -150px; Hier

+6

Scheint ziemlich hacky, aber ziemlich clever auch. +1 –

+2

Glaubst du, dies könnte als Verstoß gegen die Nutzungsbedingungen von Google angesehen werden? Ich frage das, denn wenn Sie das gleiche tun, um die Urheberrechtslinie auf der Unterseite zu verstecken, könnten Sie in Schwierigkeiten geraten. –

+0

@dooart Sie könnten den Stil ein bisschen ändern, um das Copyright auf dem Boden zu zeigen .. –