如何在.satelliteFlyover模式下绘制可调整样式的固定宽度MKPolyline？

当mapView.mapType设置为.satelliteFlyover时，默认的MKPolylineRenderer会根据缩放级别自动调整折线宽度，导致宽度无法保持恒定。你当前的自定义Renderer通过硬编码实现了固定宽度，但无法灵活修改宽度和颜色，以下是优化后的解决方案：

1. 优化自定义折线Renderer #

创建支持外部配置宽度和颜色的CustomPolylineRenderer，完全控制绘制逻辑以避免缩放影响：

class CustomPolylineRenderer: MKPolylineRenderer {
    // 可配置的固定折线宽度（单位：屏幕点）
    var fixedLineWidth: CGFloat = 170
    // 可配置的折线颜色
    var customStrokeColor: UIColor = .green
    
    override func draw(_ mapRect: MKMapRect, zoomScale: MKZoomScale, in context: CGContext) {
        guard let path = self.path else { return }
        
        // 保存上下文状态，防止干扰其他绘制操作
        context.saveGState()
        
        // 设置绘制样式
        context.addPath(path)
        context.setStrokeColor(customStrokeColor.cgColor)
        // 使用固定宽度，不乘以zoomScale，确保缩放时宽度不变
        context.setLineWidth(fixedLineWidth)
        // 可选：设置线帽和线连接方式，让折线更平滑
        context.setLineCap(.round)
        context.setLineJoin(.round)
        
        context.strokePath()
        context.restoreGState()
    }
}

2. 在代理方法中配置Renderer #

在mapView(_:rendererFor:)代理方法中创建Renderer，并按需设置宽度和颜色：

func mapView(_ mapView: MKMapView, rendererFor overlay: MKOverlay) -> MKOverlayRenderer {
    guard let polyline = overlay as? MKPolyline else {
        return MKOverlayRenderer(overlay: overlay)
    }
    
    let renderer = CustomPolylineRenderer(overlay: polyline)
    // 根据需求设置固定宽度和颜色
    renderer.fixedLineWidth = 170
    renderer.customStrokeColor = .green
    return renderer
}

关键说明 #

• 移除了对super.draw(...)的调用，避免默认Renderer的缩放逻辑干扰，完全自定义绘制流程
• 通过新增的fixedLineWidth和customStrokeColor属性，实现外部灵活配置样式
• 直接使用固定数值设置线宽，不依赖zoomScale计算，确保在.satelliteFlyover的3D视角下，折线屏幕宽度始终恒定

内容的提问来源于stack exchange，提问作者slicerdicer