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

Question

我正在使用 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>

如何在多边形单击时更改多边形的颜色

Answer 1

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

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

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


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

Answer 2

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

因此，您需要在类中使用一个函数，例如：

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

当点击事件：

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

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

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

 *ngFor="let Rpolygon of polygonPathDatas" 

快乐编码！