在MapView上渲染多条折线

时间:2014-11-25 14:44:24

标签: ios swift mkmapview mapkit mkpolyline

我有两组坐标并尝试在地图视图上绘制折线。我可以用一组坐标绘制折线,但我无法绘制两条折线。

以下是代码......

func drawRouteOnMap()
{
    var centerCoordinate : CLLocationCoordinate2D = CLLocationCoordinate2DMake(icRouteLat[0], icRouteLong[0])
    let span = MKCoordinateSpanMake(0.001, 0.001)
    var centerPosition = MKCoordinateRegionMake(centerCoordinate, span)
    mapView.setRegion(centerPosition,animated:true)
    self.mapView.mapType = MKMapType.Hybrid

    routePointer = "one";
    // first route line
    //----------able to draw polyline with this set of coordinates
    for i in 0..<routeLat.count-1
    {
        var fromCoordinate :CLLocation = CLLocation(latitude: routeLat[i], longitude: routeLong[i])
        var toCoordinate   :CLLocation = CLLocation(latitude: routeLat[i+1], longitude: routeLong[i+1])
        var locations = [fromCoordinate, toCoordinate];
        var coordinates = locations.map({(location: CLLocation) -> CLLocationCoordinate2D in return location.coordinate});
        var polyLine = MKPolyline(coordinates: &coordinates, count: locations.count);
        mapView.addOverlay(polyLine);
    }

    routePointer = "second";
    // IC route line
    //------Polyline for this set of coordinates doesn't appear on map view
    for j in 0..<icRouteLat.count-1
    {
        var fromCoordinateIC :CLLocation = CLLocation(latitude: icRouteLat[j], longitude: icRouteLat[j])
        var toCoordinateIC :CLLocation = CLLocation(latitude: icRouteLong[j+1], longitude: icRouteLong[j+1])
        var locationsIC = [fromCoordinateIC, toCoordinateIC];
        var coordinatesIC = locationsIC.map({(location: CLLocation) -> CLLocationCoordinate2D in return location.coordinate});
        var polyLineIC = MKPolyline(coordinates: &coordinatesIC, count: locationsIC.count);
        mapView.addOverlay(polyLineIC);
    }
}

func mapView(mapView: MKMapView!, rendererForOverlay overlay: MKOverlay!) -> MKOverlayRenderer! {
    let route: MKPolyline = overlay as MKPolyline
    let routeRenderer = MKPolylineRenderer(polyline:route)
    routeRenderer.lineWidth = 3.0
    if routePointer == "one"
    {
        routeRenderer.strokeColor = UIColor(red: 240.0/255.0, green: 68.0/255.0, blue: 0.0/255.0, alpha: 1);
    }
    else if routePointer == "second"
    {
        routeRenderer.strokeColor = UIColor(red: 45.0/255.0, green: 200.0/255.0, blue: 0.0/255.0, alpha: 1);
    }
    return routeRenderer
}

数组routeLat[], routeLong[]icRouteLat[] and icRouteLong[]是两组坐标。

这里有什么我想念的吗?或者这是实施的正确方法吗?

修改

根据建议更新了代码......

func drawRouteOnMap()
{
    var centerCoordinate : CLLocationCoordinate2D = CLLocationCoordinate2DMake(icRouteLat[0], icRouteLong[0])
    let span = MKCoordinateSpanMake(0.001, 0.001)
    var centerPosition = MKCoordinateRegionMake(centerCoordinate, span)
    mapView.setRegion(centerPosition,animated:true)
    self.mapView.mapType = MKMapType.Hybrid
    var polyLine: MKPolyline!
    var polyLineIC: MKPolyline!

    // first route line
    for i in 0..<routeLat.count-1
    {
        var fromCoordinate :CLLocation = CLLocation(latitude: routeLat[i], longitude: routeLong[i])
        var toCoordinate   :CLLocation = CLLocation(latitude: routeLat[i+1], longitude: routeLong[i+1])
        var locations = [fromCoordinate, toCoordinate];
        var coordinates = locations.map({(location: CLLocation) -> CLLocationCoordinate2D in return location.coordinate});
        polyLine = MKPolyline(coordinates: &coordinates, count: locations.count);
        polyLine.title = "one";
        mapView.addOverlay(polyLine);
    }

    // IC route line
    for j in 0..<icRouteLat.count-1
    {
        var fromCoordinateIC :CLLocation = CLLocation(latitude: icRouteLat[j], longitude: icRouteLong[j])
        var toCoordinateIC :CLLocation = CLLocation(latitude: icRouteLat[j+1], longitude: icRouteLong[j+1])
        var locationsIC = [fromCoordinateIC, toCoordinateIC];
        var coordinatesIC = locationsIC.map({(location: CLLocation) -> CLLocationCoordinate2D in return location.coordinate});
        polyLineIC = MKPolyline(coordinates: &coordinatesIC, count: locationsIC.count);
        polyLineIC.title = "ic";
        mapView.addOverlay(polyLineIC);
    }
}

func mapView(mapView: MKMapView!, rendererForOverlay overlay: MKOverlay!) -> MKOverlayRenderer! {
    if overlay is MKPolyline
    {
        let route: MKPolyline = overlay as MKPolyline
        let routeRenderer = MKPolylineRenderer(polyline:route)
        routeRenderer.lineWidth = 3.0
        if overlay.title == "one"
        {
            routeRenderer.strokeColor = UIColor(red: 240.0/255.0, green: 68.0/255.0, blue: 0.0/255.0, alpha: 1);
        }
        else if overlay.title == "ic"
        {
            routeRenderer.strokeColor = UIColor(red: 45.0/255.0, green: 200.0/255.0, blue: 0.0/255.0, alpha: 1);
        }
        return routeRenderer
    }

    return nil
}

最终编辑

更新的代码:

func drawRouteOnMap()
{
    var centerCoordinate : CLLocationCoordinate2D = icRoute[0];
    let span = MKCoordinateSpanMake(0.001, 0.001)
    var centerPosition = MKCoordinateRegionMake(centerCoordinate, span)
    mapView.setRegion(centerPosition,animated:true)
    self.mapView.mapType = MKMapType.Hybrid

    // first route line
    polyLine = MKPolyline(coordinates: &firstRoute, count: firstRoute.count);
    polyLine.title = "one";
    mapView.addOverlay(polyLine);

    // IC route line
    polyLine = MKPolyline(coordinates: &icRoute, count: icRoute.count);
    polyLine.title = "ic";
    mapView.addOverlay(polyLine);

}

func mapView(mapView: MKMapView!, rendererForOverlay overlay: MKOverlay!) -> MKOverlayRenderer! {
    if overlay is MKPolyline
    {
        let route: MKPolyline = overlay as MKPolyline
        let routeRenderer = MKPolylineRenderer(polyline:route)
        routeRenderer.lineWidth = 3.0
        if overlay.title == "one"
        {
            routeRenderer.strokeColor = UIColor(red: 240.0/255.0, green: 68.0/255.0, blue: 0.0/255.0, alpha: 1);
        }
        else if overlay.title == "ic"
        {
            routeRenderer.strokeColor = UIColor(red: 45.0/255.0, green: 200.0/255.0, blue: 0.0/255.0, alpha: 1);
        }
        return routeRenderer
    }

    return nil
}

1 个答案:

答案 0 :(得分:2)

主要问题在于第二个for循环:

var fromCoordinateIC :CLLocation = 
    CLLocation(latitude: icRouteLat[j], 
              longitude: icRouteLat[j])  //<-- should be icRouteLong

var toCoordinateIC :CLLocation = 
    CLLocation(latitude: icRouteLong[j+1], //<-- should be icRouteLat
              longitude: icRouteLong[j+1])

第二行不可见(或不在您预期的位置),因为它的坐标错误。

<小时/> 但是,还有一些额外的事情(不会导致或与主要问题有关)我想指出:

  1. rendererForOverlay委托方法中,代码使用外部变量routePointer来设置行的颜色。不建议这样做。 您不能假设调用委托方法的时间或频率。无法保证在执行addOverlay后立即调用委托方法。也可以为同一个叠加层多次调用委托方法。

    因此,您必须使用与传入的overlay对象直接关联的数据来设置渲染器的属性。在当前示例中,更好的选择是将每个折线的title属性设置为&#34;一个&#34;或&#34;秒&#34;并删除routePointer变量。

  2. rendererForOverlay委托方法中,最好首先检查overlayMKPolyline类型,然后再将其视为一个。您稍后可能希望添加其他类型的叠加层,例如MKCircleMKPolygon

  3. 目前,代码正在为每条路线中的 每个 线段创建单独的MKPolyline。所以如果路线&#34;一个&#34;有10个线段和路线&#34;第二个&#34;有15个,代码目前增加了25个叠加层。这不是必需的。 MKPolyline可以绘制多个线段。将路径的所有坐标添加到数组中以及循环之后,创建并添加MKPolyline会更有效。这样,你只会添加2个叠加层。

    为每条路线创建单个叠加层的示例,而不是为每条路线创建多个叠加层(路线中的每个线段都有一个叠加层):

    //First add all the coordinates to an array...
    var coordinates: [CLLocationCoordinate2D] = [CLLocationCoordinate2D]()
    for i in 0 ..< routeLat.count
    {
        var coordinate  = CLLocationCoordinate2DMake(routeLat[i], routeLong[i])
        coordinates.append(coordinate)
    }
    //Then create a single overlay with ALL the coordinates in the route...
    polyLine = MKPolyline(coordinates: &coordinates, count: coordinates.count);
    polyLine.title = "one";
    mapView.addOverlay(polyLine);
    
  4. 没有必要为纬度和经度定义单独的数组,其中每个数组都是双精度数列表。它会更有效并且会显着简化代码,以便为每条路径保留单个坐标数组(类型CLLocationCoordinate2D)。然后可以从此数组创建MKPolyline,而不进行任何循环。

    为每条路线使用CLLocationCoordinate2D s的单个数组的示例:

    var routeOneCoordinates = [CLLocationCoordinate2DMake(30.0, -87.0),
                                CLLocationCoordinate2DMake(32.0, -84.0),
                                CLLocationCoordinate2DMake(31.5, -83.5),
                                CLLocationCoordinate2DMake(31.0, -83.0),
                                CLLocationCoordinate2DMake(33.5, -82.0)]
    polyLine = MKPolyline(coordinates: &routeOneCoordinates, count: routeOneCoordinates.count);
    polyLine.title = "one";
    mapView.addOverlay(polyLine);