ios - 带有 Mapbox 和 SwiftUI 的空白地图
问题描述
我尝试将 Mapbox 与 SwiftUI 一起使用。
我应用了这个答案https://stackoverflow.com/a/56551675/5653544并遵循了mapbox 教程。
所以我有一个 MapView.swift 视图:
import SwiftUI
import Mapbox
extension MGLPointAnnotation {
convenience init(title: String, coordinate: CLLocationCoordinate2D) {
self.init()
self.title = title
self.coordinate = coordinate
}
}
struct MapView: UIViewRepresentable {
@Binding var annotations: [MGLPointAnnotation]
private let mapView: MGLMapView = MGLMapView(frame: .zero, styleURL: MGLStyle.streetsStyleURL)
// MARK: - Configuring UIViewRepresentable protocol
func makeUIView(context: UIViewRepresentableContext<MapView>) -> MGLMapView {
mapView.delegate = context.coordinator
return mapView
}
func updateUIView(_ uiView: MGLMapView, context: UIViewRepresentableContext<MapView>) {
updateAnnotations()
}
func makeCoordinator() -> MapView.Coordinator {
Coordinator(self)
}
// MARK: - Configuring MGLMapView
func styleURL(_ styleURL: URL) -> MapView {
mapView.styleURL = styleURL
return self
}
func centerCoordinate(_ centerCoordinate: CLLocationCoordinate2D) -> MapView {
mapView.centerCoordinate = centerCoordinate
return self
}
func zoomLevel(_ zoomLevel: Double) -> MapView {
mapView.zoomLevel = zoomLevel
return self
}
private func updateAnnotations() {
if let currentAnnotations = mapView.annotations {
mapView.removeAnnotations(currentAnnotations)
}
mapView.addAnnotations(annotations)
}
// MARK: - Implementing MGLMapViewDelegate
final class Coordinator: NSObject, MGLMapViewDelegate {
var control: MapView
init(_ control: MapView) {
self.control = control
}
func mapView(_ mapView: MGLMapView, didFinishLoading style: MGLStyle) {
let coordinates = [
CLLocationCoordinate2D(latitude: 37.791329, longitude: -122.396906),
CLLocationCoordinate2D(latitude: 37.791591, longitude: -122.396566),
CLLocationCoordinate2D(latitude: 37.791147, longitude: -122.396009),
CLLocationCoordinate2D(latitude: 37.790883, longitude: -122.396349),
CLLocationCoordinate2D(latitude: 37.791329, longitude: -122.396906),
]
let buildingFeature = MGLPolygonFeature(coordinates: coordinates, count: 5)
let shapeSource = MGLShapeSource(identifier: "buildingSource", features: [buildingFeature], options: nil)
mapView.style?.addSource(shapeSource)
let fillLayer = MGLFillStyleLayer(identifier: "buildingFillLayer", source: shapeSource)
fillLayer.fillColor = NSExpression(forConstantValue: UIColor.blue)
fillLayer.fillOpacity = NSExpression(forConstantValue: 0.5)
mapView.style?.addLayer(fillLayer)
}
func mapView(_ mapView: MGLMapView, viewFor annotation: MGLAnnotation) -> MGLAnnotationView? {
return nil
}
func mapView(_ mapView: MGLMapView, annotationCanShowCallout annotation: MGLAnnotation) -> Bool {
return true
}
}
}
和我的 ContentView.swift 调用 MapView:
import SwiftUI
import Mapbox
struct ContentView: View {
@State var annotations: [MGLPointAnnotation] = [
MGLPointAnnotation(title: "Mapbox", coordinate: .init(latitude: 37.791434, longitude: -122.396267))
]
var body: some View {
MapView(annotations: $annotations).centerCoordinate(.init(latitude: 37.791293, longitude: -122.396324)).zoomLevel(16)
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
我还创建了一个 ~/.mapbox 文件,其中包含我通过我的 mapbox 帐户获得的 mapbox 令牌。但我有一张空白地图:
当我下载并运行mapbox 示例时,它运行良好,所以我认为这不是因为我的 Xcode 版本。有没有人知道为什么我自己创建项目时无法加载地图?
Xcode 版本:11.3
Mapbox 版本:5.3.0
解决方案
您需要MGLMapboxAccessToken
在 Info.plist 中设置您的。
推荐阅读
- polymer - 聚合物的发光元素是否可以使用 renderProps 模式?
- sql - 如何获取 URL 最后一部分中破折号之间的最后 3 个值
- vue.js - 生产和暂存构建不同
- javascript - 将异步解析的文件添加到 JavaScript 中的数组
- jquery - 使 js 代码工作添加 - 在 TYPO3 TS 菜单中删除一个类
- tabulator - 制表符中的多选
- keras - 如何打印 Keras weight.h5 文件的权重?
- autoit - 为什么 ControlSend() 不起作用,但它在教育任务上效果很好
- javascript - Usestate + Setstate [TypeError: Invalid attempt to spread non-iterable instance.] - React Native Form Handling
- sanitization - 使用 JOI 10.2 (extend()?) 进行消毒