Google Maps - Присоединение InfoWindows к полигонам в массиве - PullRequest
3 голосов
/ 18 августа 2011

Я этим утром все время бился головой об стену. Я создаю массив полигонов и хочу связать некоторые данные в каждом из них, которые будут отображаться в информационном окне. Я могу видеть все многоугольники на карте. Я добавляю слушателя, и он срабатывает (происходит смена цвета), но я не получаю информационное окно. Любая помощь будет очень признательна!

Ура!

C ...

tmppoly = new google.maps.Polygon({
   map: map,
   paths: polypath,
   strokeColor: scolor,
   strokeOpacity: 0.5,
   strokeWeight: 2,
   fillColor: fcolor,
   fillOpacity: 0.5
});

addPolygonClick(tmppoly,mdata);
plot_polygons.push(tmppoly);

...

function addPolygonClick(poly,html) {

    infowindow = new google.maps.InfoWindow(
    { 
        content: html
    });

    google.maps.event.addListener(poly,'click', function(event) {
        this.setOptions({fillColor: "#000000"});
        infowindow.open(map);
    }); 

}

Ответы [ 3 ]

8 голосов
/ 26 сентября 2012

Я могу дать несколько полезных советов по вашему вопросу.

Во-первых, вы должны знать выражение о методе 'infowindow.open (map, anchor?: MVCObject)'.Как гласит API Google v3: В основном API единственным якорем является класс Marker.Класс Polygon не соответствует условию, однако мы можем достичь по-другому.

var polygon = new google.maps.Polygon({
    paths: PGpoints,   //The PGpoints is the collection of points around this polygon.
    map: map,
    strokeColor: colory,
    strokeOpacity: 0.6,
    strokeWeight: 1,
    fillColor: colory,
    fillOpacity: 0.35       
});

polygon.set("Info", idy);  // Set some attributes for adding extra information into this polygon.   

google.maps.event.addListener(polygon, 'click', function() {
    var infoWindow = new google.maps.InfoWindow();
    infoWindow.setContent("Information : " + polygon.get("Info"));

    // 'laty,lngy' is the location of one point in PGpoints, which can be chosen as you wish
    infoWindow.setPosition(new google.maps.LatLng(laty,lngy));     
    infoWindow.open(map);
});

Код выше прошел тест, вы можете использовать его напрямую.Затем, если вы щелкнете по одному многоугольнику, информационное окно появится над картой.

2 голосов
/ 21 августа 2011

Есть несколько проблем, которые могут помешать этому:

1: Вам нужен var перед infowindow, чтобы сделать его локальной переменной:

var infowindow = new google.maps.InfoWindow(...

Как есть, вы заменяете переменную infowindow каждый раз, когда добавляете новый прослушиватель щелчков.

2: Вам необходимо указать позицию или привязку для информационного окна (см .: http://code.google.com/apis/maps/documentation/javascript/reference.html#InfoWindowOptions).

Единственным допустимым якорем является Marker, поэтому вы, вероятно, захотите указать свойство 'position'. 'position' должен быть действительным объектом google.maps.LatLng. Я подозреваю, что вы это сделаетеВы хотите вычислить центр вашего многоугольника для использования в качестве позиции.

Вам также необходимо убедиться, что карта является глобальной переменной, хотя она, вероятно, просматривает остальную часть вашего кода.

0 голосов
/ 12 августа 2013

Пожалуйста, посмотрите на это https://developers.google.com/maps/documentation/javascript/examples/event-closure и объедините его с ответом выше, чтобы назначить уникальное сообщение для каждого полигона в вашем массиве полигонов.

Я также работаю над тем, чтобы иметь несколько полигоновв один слой с уникальным сообщением для каждого полигона.Мне пока не удалось.С ответом выше у меня появилось информационное окно, но я получаю одинаковое сообщение для всех полигонов.Как только я решу свою проблему, я опубликую решение.

...