0

I have a requirement where I want to draw a circle with four quadrants, all four quadrants with a specified angle and radius from a center point. Like below:

enter image description here

But not with the markers on the circumference. I should be able to provide an angle of arc, radius and center point. How can I achieve with the Angular Google Maps?

I'm able to get the center point and set radius and draw a circle using agm-circle directive.

I've referenced this answer: https://stackoverflow.com/a/24959636/11253641

Faizan Saiyed
  • 804
  • 3
  • 17
  • 33
  • Not sure that AGM has a directive for arc, but you can implement it based on the solution proposed in https://stackoverflow.com/questions/24956616/draw-circles-arc-on-google-maps. – xomena May 12 '19 at 09:30
  • Just like in the example given, it uses Polygon rather than a circle, Likewise, maybe we can draw an arc using AGM polygon directive? – Faizan Saiyed May 13 '19 at 04:20

1 Answers1

1

You can use a polygon directive 

<agm-map [latitude]="lat" [longitude]="lng" [zoom]="zoom">
  <agm-polyline>
      <agm-polyline-point *ngFor="let point of arcPoints" [latitude]="point.latitude" [longitude]="point.longitude">
      </agm-polyline-point>
  </agm-polyline>
</agm-map>

and in the component.ts

  ngOnInit() {
    this.arcPoints = drawArc(center, initialBearing, finalBearing, radius);
  }
f.khantsis
  • 3,256
  • 5
  • 50
  • 67
  • I'm using Angular Google Maps, which doesn't have Google Maps functions like center.lat(), center.DestinationPoint(), etc methods, which does not work for me. – Faizan Saiyed May 20 '19 at 05:39