mapInitializer() {
this.map = new google.maps.Map(this.gmap.nativeElement,
this.mapOptions);
const drawingManager = new google.maps.drawing.DrawingManager({
drawingMode: google.maps.drawing.OverlayType.MARKER,
drawingControl: true,
drawingControlOptions: {
position: google.maps.ControlPosition.TOP_CENTER,
drawingModes: [
google.maps.drawing.OverlayType.POLYGON
],
},
polygonOptions: {
fillColor: '#0FC500',
strokeColor: '#0FC500',
strokeWeight: 2,
strokeOpacity: 2,
fillOpacity: .2,
editable: true,
clickable: true,
draggable: true
// zIndex: 1
},
});
drawingManager.setMap(this.map);
google.maps.event.addListener(drawingManager, 'polygoncomplete', (polygon) => {
const len = polygon.getPath().getLength();
const polyArrayLatLng: any[] = [];
for (let i = 0; i < len; i++) {
const vertex = polygon.getPath().getAt(i);
const vertexLatLng = { lat: vertex.lat(), lng: vertex.lng() };
polyArrayLatLng.push(vertexLatLng);
}
// the last point of polygon should be always the same as the first point (math rule)
// polyArrayLatLng.push(polyArrayLatLng[0]);
console.log(polygon);
console.log("############");
let result = '';
polyArrayLatLng.map((a) => {
// return [a.lat, a.lng + '#'];
result += `${a.lat},${a.lng}#`;
})
result = result.substring(0, result.length - 1);
// console.log("get result: " + result);
// console.log('coordinates', polyArrayLatLng);
this.serviceAreaForm.patchValue({
ServiceAreaGEOCode: result
})
});
google.maps.event.addListener(drawingManager, 'click', function () {
// var polygonPaths = this.getPaths();
console.log("Polygon Selected");
});
}
<div class="col-sm-12 col-md-7 col-lg-7">
<button>Delete Shape</button>
<div class="tile">
<div class="sa-map-same-height" #mapContainer id="map">
</div>
</div>
</div>
I am able to extract one polygon coordinates from a drawn polygon but unable to detect if two/multiple polygon have drawn and stuck in fetching the coordinates value. I am using angular 12 version. also need some suggestion regarding deleting the selected polygon.
Is there any event for polygoncomplete listener from where I can detect if multiple polygon has drawn? Also should I maintain two drawing manager for two polygon?