I need to display a circle (as with MKCircle) on a GMSMapView. This is easy when using a MKMapView and MKCircle, but can't use MKCircle with GMSMapView. Any ideas?
Update:
This are the current(18.03.2013) options:
1. A ground marker containing a circle image.
2. A a circle made with several segments (polyline).
Edit:
3. Google added a GMSCircle (23.04.2013)
GMSGroundOverlayOptions *overlayOptions = [GMSGroundOverlayOptions options];
overlayOptions.icon = [UIImage imageNamed:@"circle"];
overlayOptions.position = touchMapCoordinate;
overlayOptions.bearing = 0;
overlayOptions.zoomLevel = 14.3;
[mapView addGroundOverlayWithOptions:overlayOptions];
For a circle image 40x40 pixels it looks ok. (radius is approximately 100 m)
Small segmented path solution:
GMSPolylineOptions *circle = [GMSPolylineOptions options];
CGPoint touchPoint = [mapView.projection pointForCoordinate:touchMapCoordinate];
GMSMutablePath *path = [GMSMutablePath path];
CGPoint circlePoint;
for (int i = 0; i < 360; i++)
{
circlePoint.x = touchPoint.x + radius * cos(i*M_PI/180);
circlePoint.y = touchPoint.y + radius * sin(i*M_PI/180);
CLLocationCoordinate2D aux = [mapView.projection coordinateForPoint:circlePoint];
[path addCoordinate:aux];
}
circle.path = path;
circle.width = 1;
[mapView addPolylineWithOptions:circle];
EDIT : 08.05.2013
GMSCircle solution:
CLLocationCoordinate2D circleCenter = CLLocationCoordinate2DMake(latitude, longitude);
GMSCircle *circ = [GMSCircle circleWithPosition:circleCenter
radius:1000];
circ.fillColor = [UIColor blueColor];
circ.strokeColor = [UIColor redColor];
circ.strokeWidth = 5;
circ.map = mapView;
It's a bit late since the question is over a year old, but Google searches led me here, so I thought I'd update this. Posterity 4TW!
There is now a GMSCircle
which can do, as far as I know, just about everything an MKCircle
can.
Google's documentation on the GMSCircle.
// Build a circle for the GMSMapView
GMSCircle *geoFenceCircle = [[GMSCircle alloc] init];
geoFenceCircle.radius = 130; // Meters
geoFenceCircle.position = SOME_CLLOCATION.coordinate; // Some CLLocationCoordinate2D position
geoFenceCircle.fillColor = [UIColor colorWithWhite:0.7 alpha:0.5];
geoFenceCircle.strokeWidth = 3;
geoFenceCircle.strokeColor = [UIColor orangeColor];
geoFenceCircle.map = mapView; // Add it to the map.
//Updating code for Swift 5.3
let circle = GMSCircle(position: position, radius:10)
circle.fillColor = .clear
circle.strokeWidth = 3
circle.strokeColor = .black
circle.map = mapView
It behaves very similarly to an MKCircle (overlay) in that it resizes with the zoom level of the map, etc. Please disregard the blue circle in the center; that's the user location shown on the map view, and I just used the same coordinate for the center point of the GMSCircle.
Super easy. Check out the images:
One zoom level:
And here, we're zoomed out a bit:
At the moment the SDK doesn't support circles, but there is a feature request to add circles here:
https://code.google.com/p/gmaps-api-issues/issues/detail?id=4971
In the meantime you could maybe fake a circle by drawing a polyline, with several short segments?
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With