Mapbox Annotation Extension for iOS
Mapbox Annotation Extension 是一个轻量级库,您可以使用它与 iOS 的 Mapbox Maps SDK 快速添加基本形状、图标和其他注释到地图上。
此扩展利用了运行时风格的力量,采用面向对象的方法简化注释的创建和样式。
安装
在遵循以下任何安装说明之前,您需要配置机器以下载 Mapbox Maps SDK for iOS,这是此项目的依赖项。转到您的 Mapbox 账户仪表板并创建一个具有 DOWNLOADS:READ
范围的访问令牌。
请注意:这不同于您的生产 Mapbox API 令牌。请确保将其保密,不要将其插入任何 Info.plist 文件
中。
然后,在您的家目录中创建一个名为 .netrc
的文件(如果尚未创建),然后在文件的末尾添加以下行
machine api.mapbox.com
login mapbox
password PRIVATE_MAPBOX_API_TOKEN
其中 PRIVATE_MAPBOX_API_TOKEN 是具有 DOWNLOADS:READ
范围的 Mapbox API 令牌。您现在可以使用 CocoaPods 或手动继续安装过程。
使用 CocoaPods
要使用 CocoaPods 安装 Mapbox Annotation Extension
创建包含以下规范的 Podfile
pod 'MapboxAnnotationExtension', '0.0.1-beta.2'
运行 pod repo update && pod install
并打开生成的 Xcode 工作空间。
手动安装
下载并解压缩最新版本的发布。
将MapboxAnnotationExtension.framework拖放到项目编辑器中项目的“嵌入式二进制文件”部分。在出现的表格中,请确保选中“如有必要则复制项”,然后选择完成。
Carthage & Swift Package Manager
目前不支持Carthage和Swift Package Manager ("SPM")(请参阅#64)。
演示应用程序
您可以通过运行annotationapp
目标来在这个项目中找到一个示例应用程序。
用法
Mapbox Annotation Extension支持添加圆圈、线条、多边形和符号。每种形状类型都有自己的相应控制器,用于管理同一类型的多个形状对象。
由于在添加形状到地图之前需要地图加载完成,因此应在MGLMapView:didFinishLoadingStyle:
代理方法中添加所有形状。
MGLCircleStyleAnnotation
)
圆形(圆形表示地图上的一个坐标点,具有关联的半径,单位为像素。
func mapView(_ mapView: MGLMapView, didFinishLoading style: MGLStyle) {
let circleAnnotationController = MGLCircleAnnotationController(mapView: self.mapView)
let circle = MGLCircleStyleAnnotation(center: CLLocationCoordinate2D(latitude: 59.31, longitude: 18.06), radius: 3.0, color: .blue)
circle.opacity = 0.5
circleAnnotationController.add(circle)
}
线条(《MGLLineStyleAnnotation》)
线条表示一系列连接的坐标。
func mapView(_ mapView: MGLMapView, didFinishLoading style: MGLStyle) {
let lineAnnotationController = MGLLineAnnotationController(mapView: self.mapView)
let lineCoordinates = [
CLLocationCoordinate2D(latitude: 59, longitude: 18),
CLLocationCoordinate2D(latitude: 60, longitude: 20)
]
let line = MGLLineStyleAnnotation(coordinates: lineCoordinates, count: UInt(lineCoordinates.count))
line.color = .purple
lineAnnotationController.add(line)
}
多边形(《MGLPolygonStyleAnnotation》)
多边形表示一系列连接的坐标,其中第一个和最后一个坐标相等。
func mapView(_ mapView: MGLMapView, didFinishLoading style: MGLStyle) {
let polygonAnnotationController = MGLPolygonAnnotationController(mapView: self.mapView)
let polygonCoordinates = [
CLLocationCoordinate2DMake(59, 18),
CLLocationCoordinate2DMake(62, 19),
CLLocationCoordinate2DMake(54, 20),
CLLocationCoordinate2DMake(59, 18)
]
let polygon = MGLPolygonStyleAnnotation(coordinates: polygonCoordinates, count: UInt(polygonCoordinates.count))
polygon.fillOutlineColor = .red
polygonAnnotationController.add(line)
}
符号(《MGLSymbolStyleAnnotation》)
符号表示地图上的一个坐标点,包括一个标签和相关可选的图标图像。在将图像分配给符号的图标图像之前,必须先将图像提供给地图样式的精灵。
func mapView(_ mapView: MGLMapView, didFinishLoading style: MGLStyle) {
let attraction = UIImage(named: "attraction")
if let styleImage = attraction {
self.mapView.style?.setImage(styleImage, forName: "attraction")
}
let symbolAnnotationController = MGLSymbolAnnotationController(mapView: self.mapView)
let symbol = MGLSymbolStyleAnnotation(coordinate: CLLocationCoordinate2DMake(59, 18));
symbol.iconImageName = "attraction"
symbol.text = "This is a cool place!"
symbol.textFontSize = 16
symbolAnnotationController.add(symbol)
}
显示样式注释的呼出信息
样式注释支持在注释被选中时显示呼出信息。每个呼出信息都可以显示有关其注释的附加信息。
- 要启用样式注释的呼出信息,创建一个类属性并指定将要启用的交互控制器类型
class ViewController: UIViewController {
var mapView: MGLMapView!
var circleAnnotationController: MGLCircleAnnotationController!
}
- 样式注释必须包含一个标题,并且必须实现两个代理方法,使用iOS Maps SDK。第一个方法
annotationCanShowCallout
应返回true
。第二个方法viewFor annotation:
应返回一个空的MGLAnnotationView
,其大小与样式注释的形状相符,如下所示。
extension ViewController : MGLMapViewDelegate {
func mapView(_ mapView: MGLMapView, didFinishLoading style: MGLStyle) {
circleAnnotationController = MGLCircleAnnotationController(mapView: self.mapView)
let circle = MGLCircleStyleAnnotation(center: CLLocationCoordinate2D(latitude: 59.31, longitude: 18.06), radius: 3.0, color: .blue)
circle.opacity = 0.5
circle.title = "Title"
circleAnnotationController.add(circle)
}
func mapView(_ mapView: MGLMapView, annotationCanShowCallout annotation: MGLAnnotation) -> Bool {
return true;
}
func mapView(_ mapView: MGLMapView, viewFor annotation: MGLAnnotation) -> MGLAnnotationView? {
return MGLAnnotationView(frame: CGRect(x: 0, y: 0, width: 10, height: 10))
}
}
支持的属性
每个MGLStyleAnnotation
类都可以分配一组特定的属性来配置其布局和样式。此外,MGLAnnotationController
也有属性可以将特定的布局属性分配给其所有的子MGLStyleAnnotation
。
所有这些属性都反映了在Mapbox样式规范中指定的相同值。以下是每个类支持的属性及其在Mapbox样式规范中的对应属性列表。
MGLCircleStyleAnnotation
MGLCircleAnnotationController
MGLLineStyleAnnotation
MGLLineAnnotationController
MGLPolygonStyleAnnotation
MGLPolygonAnnotationController
MGLSymbolStyleAnnotation
图标图像
iconScale
iconImageName
iconRotation
iconOffset
iconAnchor
iconOpacity
iconColor
iconHaloColor
iconHaloWidth
iconHaloBlur
符号文本
text
fontNames
textFontSize
maximumTextWidth
textLetterSpacing
textJustification
textRadialOffset
textAnchor
textRotation
textTransform
textOffset
textOpacity
textColor
textHaloColor
textHaloWidth
textHaloBlur
图标图像和符号文本
MGLSymbolAnnotationController
图标图像
iconAllowsOverlap
iconIgnoresPlacement
iconOptional
iconPadding
iconPitchAlignment
iconRotationAlignment
iconTextFit
iconTranslation
iconTranslationAnchor
keepsIconUpright
符号文本
textAllowsOverlap
textLineHeight
textOptional
textPadding
textPitchAlignment
textRotationAlignment
textVariableAnchor
textTranslation
textTranslationAnchor
keepsTextUpRight
maximumTextAngle
图标图像和符号文本
支持
请注意,这是一个实验性项目,可能随时更改。
如果您有任何疑问或反馈,请在此存储库中创建一个新的问题。
如果您想报告一个错误,请尽可能提供详细信息,以便我们可以快速重现问题。
有关使用Mapbox Maps SDK for iOS的帮助,请查看我们的文档。