谷歌地图v3 API鼠标悬停与GeoJson多边形图层

时间:2016-08-24 14:07:12

标签: javascript google-maps google-maps-api-3 mouseover geojson

如何让鼠标悬停事件与多边形形状上的谷歌地图Api V3配合使用?

我无法在鼠标悬停时触发事件。

  var data_layer25 = new google.maps.Data({ map: map });
                                data_layer25.loadGeoJson('http://example.com/Assets/GeoJson/USA-MO.GeoJson');
                                data_layer25.setStyle({
                                            fillColor: '    #808000  ',
                                            strokeWeight: 1
                                    });
                                google.maps.event.addListener((data_layer25), "click", function () { window.location = "/RepTerritory/index/9" });
                    google.maps.event.addListener((data_layer25), "mouseover", function () {
                          this.setOptions({ fillColor: "#00FF00" });
                     });

                    google.maps.event.addListener((data_layer25), "mouseout", function () {
                          this.setOptions({ fillColor: "#FF0000" });
            });
            data_layer25.setMap(map);

1 个答案:

答案 0 :(得分:2)

尝试使用它来更改鼠标事件Data Layer的样式:

data_layer25.addListener('mouseover', function(e) {
     data_layer25.setStyle({
         fillColor: "#00FF00"
     });
});

data_layer25.addListener('mouseout', function(e) {
     data_layer25.setStyle({
         fillColor: "#FF0000"
     });
});