谷歌地图图层点击更改样式多边形

时间:2017-10-19 07:40:15

标签: javascript angularjs google-maps

我正在使用geojson数据处理Google地图中的图层。

我现在拥有的是一个包含四个不同多边形的图层,当您点击它们时,它们会从灰色变为绿色。 但是当我再次点击它时它不会变回灰色,这就是点击功能的目的。

map.data.setStyle(function(feature) {
  var color;
    if (feature.getProperty('isColorful')) {
      color = '#009900';
    }else{
      color: 'grey';
    }
    return ({
      fillColor: color,
      strokeColor: color,
      strokeWeight: 2
    });
});

就我而言,它适用于我的编辑器https://embed.plnkr.co/hi4MtjO8f0PN6rCW70rE/。 这是完整的代码段。

我修好了!! 我改变几行的位置并将其设置为false或true

map.data.setStyle(function(feature) {
var color;
if (feature.getProperty('isColorful')) {
  feature.setProperty('isColorful', false);
  color = '#009900';
}else{
  color: 'grey';
}
return /** @type {google.maps.Data.StyleOptions} */({
  fillColor: color,
  strokeColor: color,
  strokeWeight: 2
});
});

map.data.addListener('click', function(event) {
var name = event.feature.getProperty('name'); 
var index = vm.areas.indexOf(name);
  if(index >= 0){
    vm.areas.splice(index,1);
    event.feature.setProperty('isColorful', false);
  } else{
    vm.areas.push(name);
    event.feature.setProperty('isColorful', true);
  }
  $scope.$apply();
});

1 个答案:

答案 0 :(得分:0)

你应该在你的else子句中更改isColorful属性b,否则你总是错误的

| async