Swift之高德地图自定义覆盖物(定位标注和poi标注)

由于项目需求,需要将高德地图api 中的,覆盖物,自定义。但是由于官方教程是由oc 语言编写,于是,不得不将oc 的语法,转换成swift 的语法来进行实现。

1.几个关键类和协议

MAAnnotation 协议

Swift之高德地图自定义覆盖物(定位标注和poi标注)_第1张图片
高德地图,oc源码

MAAnnotationView 类,继承  UIView 

Swift之高德地图自定义覆盖物(定位标注和poi标注)_第2张图片
高德地图oc源码

定位信息类 MAUserLocation  实现MAAnnotation 协议

Swift之高德地图自定义覆盖物(定位标注和poi标注)_第3张图片
定位信息类,高德地图oc 源码

MAPointAnnotation 类,包含(title,subtitle,经纬度)

Swift之高德地图自定义覆盖物(定位标注和poi标注)_第4张图片
点标注数据类,高德oc 源码

MAPinAnnotationView类,继承MAAnnotationView 实现大头针的样式

Swift之高德地图自定义覆盖物(定位标注和poi标注)_第5张图片
大头针样式类,高德oc 源码

2.几个关键的方法

前提 :当前controller 类,实现MAMapViewDelegate 协议

协议方法

func mapView(mapView:MAMapView, viewForAnnotation annotation:MAAnnotation) ->MAAnnotationView? {

//第一步判断当前的标注(annotation)是哪一个类

//针对不同的标注进行添加自定义view,自定义数据

}

定位标注物,swift版代码实现。

Swift之高德地图自定义覆盖物(定位标注和poi标注)_第6张图片
定位标注,swift代码实现

POI 点标注物代码(1.加载poi 点数据,2.在回调方法中进行加载)

1.加载poi 点数据

Swift之高德地图自定义覆盖物(定位标注和poi标注)_第7张图片
加载poi 点数据,swift代码实现

2.回调实现(canShowCallout=true为弹出高德sdk 中的气泡对话框样式)

Swift之高德地图自定义覆盖物(定位标注和poi标注)_第8张图片
poi 回调方法,标注物。

以上,为swift版,实现覆盖物(由于项目中需要实现标注物如下)。

Swift之高德地图自定义覆盖物(定位标注和poi标注)_第9张图片
项目需求

问题:如何将标注物的image ,变成圆形和加白色边框(coding 中)。

通过研究,熟悉到几个类和关键的参数,实现项目需求

CALayer 类 属性

masksToBounds 设置为true 对所在view 的边界进行裁剪,超出view 大小范围,则全部裁剪掉,无法显示。

cornerRadius 设置圆角,一般设置为 view.bouds.width/2 才能实现圆形

borderWidth 设置边框

borderColor 设置边框颜色

由于,在整体frame.layer.masksToBounds=true,无法将气泡弹出,之后想到在当前的view 中添加imageview 然后 对imageview 进行裁剪,设置圆角。这样完美解决需求。

Swift之高德地图自定义覆盖物(定位标注和poi标注)_第10张图片
实现圆角,白色边框swift代码

运行效果图

Swift之高德地图自定义覆盖物(定位标注和poi标注)_第11张图片
实现效果图

你可能感兴趣的:(Swift之高德地图自定义覆盖物(定位标注和poi标注))