浏览器版本低!无法浏览完整内容,建议升级或更换浏览器。
绘制线简介

折线类为 BMKPolyline,由一组经纬度坐标组成,并以有序序列形式建立一系列的线段。
注意:V5.0.0后的版本,绘制线宽会变细,lineWidth统一为画笔宽度,请注意适配

绘制折线
1创建BMKMapView,并设置delegate
BMKMapView *mapView = [[BMKMapView alloc]initWithFrame:self.view.bounds];
mapView.delegate = self;
[self.view addSubView:mapView];
2添加折线覆盖物数据
// 添加折线覆盖物
CLLocationCoordinate2D coords[5] = {0};
coords[0] = CLLocationCoordinate2DMake(39.968, 116.260);
coords[1] = CLLocationCoordinate2DMake(39.912, 116.324);
coords[2] = CLLocationCoordinate2DMake(39.968, 116.373);
coords[3] = CLLocationCoordinate2DMake(39.912, 116.439);
coords[4] = CLLocationCoordinate2DMake(39.968, 116.490);
BMKPolyline *polyline = [BMKPolyline polylineWithCoordinates:coors count:5];
[_mapView addOverlay:polyline];
3实现代理方法
- (BMKOverlayView *)mapView:(BMKMapView *)mapView viewForOverlay:(id <BMKOverlay>)overlay{
    if ([overlay isKindOfClass:[BMKPolyline class]]){
         BMKPolylineView *polylineView = [[BMKPolylineView alloc] initWithPolyline:overlay];
         //设置polylineView的画笔颜色为蓝色
         polylineView.strokeColor = [[UIColor alloc] initWithRed:19/255.0 green:107/255.0 blue:251/255.0 alpha:1.0];
         //设置polylineView的画笔宽度为16
         polylineView.lineWidth = 16;
         //圆点虚线,V5.0.0新增
//        polylineView.lineDashType = kBMKLineDashTypeDot;
         //方块虚线,V5.0.0新增
//       polylineView.lineDashType = kBMKLineDashTypeSquare;
         return polylineView;
    }
    return nil;
}
4运行程序

效果如图:

newIos%2Fpolyline1v5.png newIos%2Fpolyline2v5.png

分段颜色绘制折线

iOS地图SDK支持折线多段颜色绘制能力。

1添加分段折线数据,并构建分段颜色索引数组
CLLocationCoordinate2D coords[5] = {0};
coords[0] = CLLocationCoordinate2DMake(39.968, 116.260);
coords[1] = CLLocationCoordinate2DMake(39.912, 116.324);
coords[2] = CLLocationCoordinate2DMake(39.968, 116.373);
coords[3] = CLLocationCoordinate2DMake(39.912, 116.439);
coords[4] = CLLocationCoordinate2DMake(39.968, 116.490);
//构建分段颜色索引数组
NSArray *colorIndexs = [NSArray arrayWithObjects:
                                [NSNumber numberWithInt:0],
                                [NSNumber numberWithInt:1],
                                [NSNumber numberWithInt:2],
                                [NSNumber numberWithInt:3], nil];
BMKPolyline *polyline  = [BMKPolyline polylineWithCoordinates:coords count:5 textureIndex:colorIndexs];
[_mapView addOverlay:polyline];
2实现代理方法,并设置分段颜色
//根据overlay生成对应的View
- (BMKOverlayView *)mapView:(BMKMapView *)mapView viewForOverlay:(id <BMKOverlay>)overlay{
    if ([overlay isKindOfClass:[BMKPolyline class]]){
           BMKPolylineView *polylineView = [[BMKPolylineView alloc] initWithPolyline:overlay];
           //设置polylineView的画笔宽度为12
            polylineView.lineWidth = 12;
            /**
             分段设置polylineView的颜色
             注:初始化UIColor请使用-initWithRed:green:blue:alpha:,若使用[UIColor **Color]
             个别case转换成RGB后会有问题
             */
            polylineView.colors = [NSArray arrayWithObjects:
                              [[UIColor alloc] initWithRed:246/255.0 green:57/255.0 blue:57/255.0 alpha:1.0],
                              [[UIColor alloc] initWithRed:253/255.0 green:173/255.0 blue:42/255.0 alpha:1.0],
                              [[UIColor alloc] initWithRed:28/255.0 green:188/255.0 blue:82/255.0 alpha:1.0],
                              [[UIColor alloc] initWithRed:19/255.0 green:107/255.0 blue:251/255.0 alpha:1.0],
                                   nil];
             //设置头尾处圆帽样式,V5.0.0新增
 //           polylineView.lineCapType = kBMKLineCapRound;
            return polylineView;
    }
    return nil;
}

3运行程序

newIos%2Fpolyline3v5.png

分段纹理折线

iOS地图SDK支持折线分段颜色绘制能力。

纹理素材格式:纹理图宽高片须是2的整数幂,如64*64,否则无效;若设置了纹理图片,设置线颜色类型将无效。

注意:目前仅支持对折线设置纹理,其余覆盖物目前暂不支持设置纹理。

1添加分段纹理绘制折线数据,并构建构建分段纹理索引数组
//构建顶点数组
CLLocationCoordinate2D coords[5] = {0};
coords[0] = CLLocationCoordinate2DMake(39.968, 116.260);
coords[1] = CLLocationCoordinate2DMake(39.912, 116.324);
coords[2] = CLLocationCoordinate2DMake(39.968, 116.373);
coords[3] = CLLocationCoordinate2DMake(39.912, 116.439);
coords[4] = CLLocationCoordinate2DMake(39.968, 116.490);
//构建分段颜色索引数组
NSArray *colorIndexs = [NSArray arrayWithObjects:
                                [NSNumber numberWithInt:0],
                                [NSNumber numberWithInt:1],
                                 [NSNumber numberWithInt:2],
                                [NSNumber numberWithInt:3], nil];
BMKPolyline *polyline  = [BMKPolyline polylineWithCoordinates:coords count:5 textureIndex:colorIndexs];
        [_mapView addOverlay:polyline];
2实现代理方法,并加载分段纹理图片
//根据overlay生成对应的View
- (BMKOverlayView *)mapView:(BMKMapView *)mapView viewForOverlay:(id <BMKOverlay>)overlay{
    if ([overlay isKindOfClass:[BMKPolyline class]]){
           BMKPolylineView *polylineView = [[BMKPolylineView alloc] initWithPolyline:overlay];
           //设置polylineView的画笔宽度为12
             polylineView.lineWidth = 12;
            
            /**
             *加载分段纹理绘制 所需的纹理图片
             @param textureImages 必须UIImage数组,opengl要求图片宽高必须是2的n次幂,否则,返回NO,无法分段纹理绘制
             @return 是否成功
             */ 
            [polylineView loadStrokeTextureImages:@[[UIImage imageNamed:@"traffic_texture_congestion"],
                                                    [UIImage imageNamed:@"traffic_texture_slow"],
                                                    [UIImage imageNamed:@"traffic_texture_smooth"],
                                                    [UIImage imageNamed:@"traffic_texture_unknown"]]];
             //拐角处尖角衔接,V5.0.0新增
 //           polylineView.lineJoinType = kBMKLineJoinMiter;//尖角
 //            polylineView.lineJoinType = kBMKLineJoinRound//圆角
            return polylineView;
    }
    return nil;
}

3运行程序
效果如图:

newIos%2Fpolyline4v5.png

  • 文档根本没法用

  • 文档水平很差

  • 文档水平一般

  • 文档不错

  • 文档写的很好

如发现文档错误,或对此文档有更好的建议,请在下方反馈。问题咨询请前往反馈平台提交工单咨询。

提交反馈

拖动标注工具

添加矩形标注

添加箭头标注

完成

取消