Google Maps: Wie füge ich HTML-Elemente zu bestimmten Koordinaten hinzu?

Question

Ich würde gerne wissen, wie und ob ich Standard-HTML-Elemente (div, button) zu einem bestimmten Satz von Koordinaten auf der Karte hinzufügen kann?

Zum Beispiel habe ich einen Satz von Koordinaten, und ich möchte eine benutzerdefinierte Sprechblasen-Benachrichtigung, um sie

Google Maps with custom styled element attached to a set of coordinates http://i45.tinypic.com/dfc7sj.png

befestigen und zu, wenn ich weg das Element aus den Koordinaten schwenken sollte verschwinden und wenn ich zurück schwenken für sie sollte das Element wieder erscheinen.

Ist dies mit Google Maps möglich?

Answer 1

können Sie benutzerdefinierte Overlays verwenden - https://developers.google.com/maps/documentation/javascript/customoverlays für diese

Answer 2

wie Roman sagte, können Sie eine benutzerdefinierte erstellen JavaScript-Objekt, das GOverlay implementiert.

Hier ist ein Beispiel von einem anderen S.O. Frage, wo der Typ eine SVG auf einer Google-Karte einfügen wollte. Ich bin jedoch ziemlich sicher, dass Sie seine Lösung verwenden können, um einfach HTML einzufügen.

How can I overlay SVG diagrams on Google Maps?

Answer 3

Was Sie wollen, zu betrachten ist die openInfoWindowHtml Funktion. Sie müssen zuerst einen marker zur Karte hinzufügen. Ein gutes Beispiel dafür finden Sie bei Google in this example, kombiniert mit der raffinierten Maximierungsfunktion.

Answer 4

Wenn Sie einen benutzerdefinierten Ballon machen mögen, finden Sie diese Frage:

Google Maps Bubble Templates

Answer 5

Siehe this als Basisklasse für die neueste Google Maps API-Version (Version 3):

Verbrauch:

var rectBounds = new google.maps.LatLngBounds(
    new google.maps.LatLng(54.478490, 18.550357), 
    new google.maps.LatLng(54.478434, 18.551952) 
); 
var obj = new overlayText(rectBounds, 'Some<br />HTML', objGMap3);