Draw rectangle in MKMapView - ios

Question

I am trying to draw a red rectangle in my MKMapView. I see the map, but not the rectangle. My code:
public override void ViewDidLoad()
{
base.ViewDidLoad();
var areaMapView = new AreaMapView();
areaMapView.SetTarget(45.5399396, -73.6534612);
areaMapView.AddZone(new List<Geolocation>()
{
new Geolocation() { Latitude = 25.774, Longitude = -80.190},
new Geolocation() { Latitude = 18.466, Longitude = -66.118},
new Geolocation() { Latitude = 32.321, Longitude = -64.757},
new Geolocation() { Latitude = 25.774, Longitude = -80.190},
});
View = areaMapView;
}
public class AreaMapView : MKMapView
{
public AreaMapView() : base(UIScreen.MainScreen.Bounds)
{
this.ShowsUserLocation = true;
this.MapType = MKMapType.Satellite;
}
public void SetTarget(double longitude, double latitude)
{
this.AddAnnotations(new MKPointAnnotation()
{
Title = "Target",
Coordinate = new CLLocationCoordinate2D(longitude, latitude)
});
}
public void AddZone(List<Geolocation> longitudeAndLatitudePoints)
{
var coords = new CLLocationCoordinate2D[longitudeAndLatitudePoints.Count];
for (int i = 0; i < longitudeAndLatitudePoints.Count; i++)
{
double longitude = longitudeAndLatitudePoints[i].Longitude;
double latitude = longitudeAndLatitudePoints[i].Latitude;
coords[i] = new CLLocationCoordinate2D(longitude, latitude);
}
this.AddOverlay(MKPolyline.FromCoordinates(coords));
}
}

Answer 1

I think you should use MKPolygon and MKPolygonRenderer to add a rectangle.
refer to here: https://developer.xamarin.com/recipes/ios/content_controls/map_view/add_an_overlay_to_a_map/
Sample here: https://github.com/xamarin/recipes/tree/master/ios/content_controls/map_view/add_an_overlay_to_a_map
follow the sample and replace the code
mapView.OverlayRenderer = (m, o) =>
{
if (circleRenderer == null)
{
circleRenderer = new MKCircleRenderer(o as MKCircle);
circleRenderer.FillColor = UIColor.Purple;
circleRenderer.Alpha = 0.5f;
}
return circleRenderer;
};
circleOverlay = MKCircle.Circle(coords, 400);
mapView.AddOverlay(circleOverlay);
By
mapView.OverlayRenderer = (m, o) =>
{
if (polygonRenderer == null)
{
polygonRenderer = new MKPolygonRenderer(o as MKPolygon);
polygonRenderer.FillColor = UIColor.Red;
polygonRenderer.StrokeColor = UIColor.Black;
polygonRenderer.Alpha = 0.5f;
}
return polygonRenderer;
};
var coord = new CLLocationCoordinate2D[4];
coord[0] = new CLLocationCoordinate2D(29.976111, 31.132778);
coord[1] = new CLLocationCoordinate2D(29.976111, 31.032778);
coord[2] = new CLLocationCoordinate2D(29.876111, 31.032778);
coord[3] = new CLLocationCoordinate2D(29.876111, 31.132778);
mapView.AddOverlay(MKPolygon.FromCoordinates(coord));
This is the result