Angular 2 谷歌地图，点击多边形改变多边形颜色答案

【问题标题】：Angular 2 google maps , change polygon color on polygon clickAngular 2 谷歌地图，点击多边形改变多边形颜色
【发布时间】：2019-04-26 08:26:00
【问题描述】：

我正在使用 Angular 2 谷歌地图https://angular-maps.com/docs/api/latest/ts/core/index/SebmGoogleMap-directive.html

       <sebm-map-polygon #polygon *ngFor="let Rpolygon of polygonPathDatas" 
        [paths]="Rpolygon.path"
        [clickable] = "true"
        strokeColor ="#00000"
        [strokeWeight]=".6"      
        [editable]="false"
        [draggable]="false" 
        (polyClick)="click($event,polygon)" 
        (polyDblClick)="delete($event)">
      </sebm-map-polygon>

如何在点击多边形时改变多边形的颜色

【问题讨论】：

标签： angular angular2-google-maps

【解决方案1】：

您可以使用名为 PolygonOptions 的属性。例如


//create new options
var newOptions: PolygonOptions = {};

newOptions.fillColor = #223366;
newOptions.fillOpacity = 0.8;


//update polygon options
polygon.setOptions(newOptions);

【讨论】：

【解决方案2】：

我查看了文档，您似乎需要更改多边形上的“fillColor”属性。

所以你需要一个函数在你的类中：

click(event,polygon) {
    polygon.fillColor = "#9c9c9c"
}

点击事件时：

(polyClick)="click($event, Rpolygon)"

被触发它调用点击函数并且多边形会改变它的颜色。这就是理论，让它成为现实！

Ps.：您的代码中有错字。在函数调用中单击它必须是“Rpolygon”而不是“多边形”，因为它是迭代中对多边形的引用。

 *ngFor="let Rpolygon of polygonPathDatas"

编码愉快！

【讨论】：