如何使用绘图管理器从谷歌地图中删除绘制的圆或多边形。
组件:
import {Ng2MapComponent, DrawingManager, Polygon} from 'ng2-map';
export class CreateAlertComponent implements OnInit {
@ViewChild(Ng2MapComponent) mapObj: Ng2MapComponent;
@ViewChild(DrawingManager) drawingManager: DrawingManager;
polygonCompleteFunction(e) {
console.log(this.mapObj);
};
});
HTML:
<ng2-map [zoom]="mapOptions.zoom" [minZoom]="mapOptions.minZoom" [center]="mapOptions.center" clickable="false" (click)="mapClick($event)">
<drawing-manager *ngIf = "selectedJurisdictions.length > 0"
[drawingMode]="'null'"
[drawingControl]="true"
[drawingControlOptions]="{
position: 2,
drawingModes: ['circle', 'polygon']
}"
[circleOptions]="{
fillColor: 'red',
fillOpacity: 0.3,
strokeColor: 'black',
strokeWeight: 2,
editable: true,
draggable: true,
zIndex: 1
}"
[polygonOptions]="{
fillColor: 'red',
fillOpacity: 0.3,
strokeColor: 'black',
strokeWeight: 2,
editable: true,
draggable: true,
zIndex: 1
}"
(polygoncomplete)="polygonCompleteFunction($event)"
(circlecomplete)="circleCompleteFunction($event)">
</drawing-manager>
</ng2-map>
但是在 polygon complete 函数或 circle complete 上,我没有从 map 对象中获取绘制的多边形
最佳答案
您可以从CircleComplete
/PolygonCompolete
事件的参数中找到绘制的多边形或圆。或者通过event.overlay 从OverlayComplete 事件的参数中找到目标。
获取目标对象后,您可以将其保存在某个地方,以便在其他地方删除它们。
polygonCompleteFunction(e) {
console.log(e); // this is the drawn Polygon you are looking for, and same for the circleComplete event
};
overlayComplete(e) {
console.log(e.overlay); // here can also find the drawn shape(Polygon/Circle/Polyline/Rectangle)
}
删除目标Polygon或Circle时,参照之前保存的实例进行删除。
target.setMap(null);
这是关于 OverlayComplete 事件的 GooleMapApi 文档:
google.maps.event.addListener(drawingManager, 'circlecomplete', function(circle) { var radius = circle.getRadius(); });
google.maps.event.addListener(drawingManager, 'overlaycomplete', function(event) { if (event.type == 'circle') { var radius = event.overlay.getRadius(); } });
这是 link到 GoogleMapApi 文档。
希望对您有所帮助。这是一个 plunker可以引用。
关于javascript - 如何使用绘图管理器从谷歌地图中删除绘制的圆或多边形 - ng2-map,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42830696/