Dotted line on map view

7.5k views Asked by At

I can create a line between two points fairly easy with the below code (part of it anyways) How could I make the line dotted instead of solid? Also would it be possible to change the opacity the longer the line is?

- (MKOverlayRenderer *)mapView:(MKMapView *)mapView rendererForOverlay:(id < MKOverlay >)overlay
{
    MKPolylineRenderer *renderer =[[MKPolylineRenderer alloc] initWithPolyline:overlay];
    renderer.strokeColor = [UIColor orangeColor];
    renderer.lineWidth = 3.0;

    return renderer;
}
2

There are 2 answers

4
AudioBubble On BEST ANSWER

You can use the lineDashPattern property to create the pattern you want for the line.

MKPolylineRenderer is a subclass of MKOverlayPathRenderer which has that property and a few others (see the link to the documentation).

For example, this sets the pattern to a line 2 points long followed by a 5 point gap. The pattern is repeated for the entire length of the polyline.

renderer.lineDashPattern = @[@2, @5];


For the opacity, you can either apply an alpha to the strokeColor:

renderer.strokeColor = [[UIColor orangeColor] colorWithAlphaComponent:0.5];

or set the alpha property:

renderer.alpha = 0.5;

Not sure what you mean by "the longer the line is" part of the question.

1
Abin Baby On

Answer in Swift

func mapView(_ mapView: MKMapView, rendererFor overlay: MKOverlay) -> MKOverlayRenderer {
    guard let polyline = overlay as? MKPolyline else {
        fatalError("Not a MKPolyline")
    }

    let renderer = MKPolylineRenderer(polyline: polyline)

    renderer.strokeColor = #colorLiteral(red: 0.1764705926, green: 0.4980392158, blue: 0.7568627596, alpha: 1)
    renderer.lineWidth = 8
    renderer.lineDashPattern = [0, 10]

    return renderer
} 

enter image description here