Wie kann ich einen link von Google Maps Marker zu anderen Elementen?

Mithilfe der google maps (und JavaScript) habe ich die Möglichkeit, einfach die Anzeige mehrerer Marker, die jeder ein nettes kleines info-Fenster über Ihnen.

//Create map over USA
map = new google.maps.Map2( document.getElementById('map') );
map.setCenter(new GLatLng(38.95940879245423, -100.283203125), 3);

//Create point, then marker, and then add to map
function create_marker(lat, lng, html) {
    var marker = new GMarker( new GLatLng(lat,lng));
    marker.bindInfoWindow(html);
    map.addOverlay(marker);
}

var html = '<div>this is my text</div>';
create_marker(38.95940879245423, -100.283203125, html);

Jedoch will ich nun in der Lage, die "Klick" - Marker für die Funktionen, die aktualisiert werden können andere Teile der Seite als auch. Zum Beispiel würde ich gern eine sidebar mit Kopien der marker, Infofenster Inhalt. Die gleiche Weise google maps zeigt Ergebnisse auf der linken Seite und Markierungen auf der rechten Seite. Ich könnte auch wollen, die klicken Sie auf der Seitenleiste zu öffnen, einen bestimmten marker, Infofenster auf der Karte.

Das problem ist, dass die GMarker click-Ereignis übergibt nur den lat/long - und ich bin mir nicht sicher, wie kann ich verwenden, um den entsprechenden div oder was auch immer.

Wie bekomme ich eine eindeutige id/handle für jeden marker?

InformationsquelleAutor Xeoncross | 2009-10-05
  1. 3

    Zuweisen einer id für jeden einzelnen marker und deren korrespondierende element in der Seitenleiste. Erstellen Sie einen Ereignis-listener aufrufen, die id. So etwas wie dieses:

    var html = '<div>this is my text</div>';
var sideHtml = '<div id="1">this is my text</div>';
create_marker(38.95940879245423, -100.283203125, html, 1);
$("#sidebar").append(sideHtml); //Add the text to the sidebar (jQuery)

//Create point, then marker, and then add to map
function create_marker(lat, lng, html, id) {
    var marker = new GMarker( new GLatLng(lat,lng));
    marker.bindInfoWindow(html);
    map.addOverlay(marker);

    GEvent.addListener(marker, 'click', function(latlng) {
        var div = document.getElementById(id); //access the sidebar element
        //etc...
    });
}

    Siehe auch diese Frage.

    InformationsquelleAutor Chris B
  2. 0

    Für die interessierten gibt es ein tolles Beispiel von lFarbwerk dom-Elemente mit Markierungen, die hier gegeben werden. Im Grunde erstellen Sie einfach eine Globale JS-array, das einen Verweis auf die einzelnen marker-Objekt.

    InformationsquelleAutor Xeoncross
Schreibe einen Kommentar