Thickbox und Google Maps Link

Question

Ich benutze die Thickbox von jQuery und möchte sie für einen Google Map-Link verwenden.

Der Ansatz, den ich gesehen habe, funktioniert nicht für das Link (URL) -Format, das ich verwende.

Das URL-Format:

http://maps.google.com/?q=1200 Pennsylvania Ave SE, Washington, District of Columbia, 20003

Also, wenn ich diese verwenden:

<a class='thickbox' href='http://maps.google.com/?q=1200 Pennsylvania Ave SE, Washington, District of Columbia, 20003'> 
    Map 
</a> 

es Umleitungen an die gerade Google Maps-Seite, anstatt das Popup mit der Google-Karte zu öffnen. Ich versuche, die Ajax-Aufruf an die URL

?height=300&width=300 

anhängen Aber es funktioniert nicht

Answer 1

Ich poste eine separate Antwort, weil es eine andere Möglichkeit gibt, dies zu erreichen - ohne die gesamte Google Maps-Seite in der Thickbox zu haben - wir wollen nur die Karte selbst.

Diese Methode platziert die Karte in einem versteckten Iframe auf der Seite. Dies ist die "Inline-Content" -Methode von Thickbox.

<a href="#TB_inlinemodalContent?height=410&width=505&inlineId=hiddenDiv" title="add a caption to title attribute/or leave blank" class="thickbox">Show hidden modal content.</a> 

<div id="hiddenDiv" style="display:none;"> 
    <iframe width="500" height="400" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/?q=1200 Pennsylvania Ave SE, Washington, District of Columbia, 20003&amp;t=h&amp;output=embed"></iframe> 
</div> 

Durch output=embed Zugabe bekommen wir nur die Karte selbst in der iframe. t=h macht es eine Satellitenkarte.Sie können diese in Ihrer ursprünglichen Methode zu dem Link hinzufügen (indem Sie direkt einen iframe öffnen), aber das Mischen der URL-Parameter für Google Maps und Thickbox scheint es ein wenig zu stören.

Answer 2

Vielleicht ist es, weil Sie diesen Teil haben:

http://maps.google.com/?q= 

In Ihrem Link zweimal?

Answer 3

Möglicherweise müssen Sie Ihre Doppel

http://maps.google.com/?q=

als jjclarkson sagte entfernen, aber Sie müssen auch die Räume in Ihrer Adresse zu entkommen.

So folgt aus:

<a class='thickbox' href='http://maps.google.com/?q=http://maps.google.com/?q=1200 Pennsylvania Ave SE, Washington, District of Columbia, 20003'> 
    Map 
</a> 

wird dies:

<a class='thickbox' href='http://maps.google.com/?q=http://maps.google.com/?q=1200%20Pennsylvania%20Ave%20SE%2C%20Washington%2C%20District%20of%20Columbia%2C%2020003'> 
    Map 
</a> 

URLs müssen die meisten nicht-alphanumerischen Zeichen entgangen haben.

Answer 4

Um URLs in einem Iframe in Thickbox zu öffnen, müssen Sie diese an Ihre URL anhängen:

&KeepThis=true&TB_iframe=true&height=400&width=600 

Siehe ThickBox Anweisungen für IFramed Inhalt.

Sie sollten in der Tat die doppelte http://maps.google.com/?q= entfernen, aber es sollte immer noch funktionieren, wenn Sie die Leerzeichen nicht entkommen (nicht, dass es gute Praxis ist).