You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在Google Maps iOS SDK(Swift)中设置多段折线颜色

实现多颜色动态折线绘制(基于Google Maps iOS SDK)

要解决多颜色折线同时动态绘制的问题,核心是为每条线路独立维护自己的GMSPolyline实例和路径,通过唯一标识区分不同线路,分别配置样式。下面是具体的实现方案和代码修改:

核心思路

  • 用字典存储不同线路的折线实例和路径,键可以是线路的唯一标识(比如"A-B"、"moving-car")
  • 预定义每条线路的颜色配置,初始化时根据标识创建对应样式的折线
  • 动态更新时,根据当前线路标识找到对应的折线,追加新点位更新路径

修改后的完整代码实现

首先,在你的视图控制器类中添加字典属性来管理多条折线和路径:

// 存储不同线路的折线实例,key为线路唯一标识
var polylineMap: [String: GMSPolyline] = [:]
// 存储不同线路的路径,key和polylineMap一一对应
var pathMap: [String: GMSMutablePath] = [:]

// 预定义线路颜色配置,可根据需求随时扩展
private let lineColorConfig: [String: UIColor] = [
    "A-B": UIColor.red,
    "moving-car": UIColor(red:1.00, green:0.84, blue:0.00, alpha:1.0) // 黄色
]

1. 初始化指定线路的折线

新增通用的初始化方法,支持传入线路标识来创建对应颜色的折线:

func initializePolyline(forLineID lineID: String) {
    // 检查是否已存在该线路的折线,避免重复创建
    guard polylineMap[lineID] == nil else { return }
    
    let path = GMSMutablePath()
    pathMap[lineID] = path
    
    let polyline = GMSPolyline()
    // 从配置中获取对应颜色,默认用灰色兜底
    let lineColor = lineColorConfig[lineID] ?? .gray
    let strokeStyle = GMSStrokeStyle.solidColor(lineColor)
    polyline.spans = [GMSStyleSpan(style: strokeStyle)]
    polyline.strokeWidth = 5.0 // 统一设置线宽,也可放到颜色配置里灵活调整
    polyline.map = self.mapView
    
    polylineMap[lineID] = polyline
}

2. 动态更新指定线路的点位

修改更新方法,支持传入线路标识,精准更新对应折线的路径:

func updatePolyline(forLineID lineID: String, withNewLocation newLocation: CLLocation) {
    // 确保该线路已完成初始化
    guard let path = pathMap[lineID], let polyline = polylineMap[lineID] else {
        print("Error: Line \(lineID) not initialized!")
        return
    }
    
    // 追加新点位到路径
    path.add(newLocation.coordinate)
    polyline.path = path
    
    // 保留原代码中动态车辆路径的持久化逻辑
    if lineID == "moving-car" {
        if let index = DBidArr.firstIndex(of: movingChannel), index < pathDB.count {
            pathDB[index].add(newLocation.coordinate)
        }
    }
}

3. 调用示例

  • 初始化静态线路A-B(红色):
// 假设A、B是固定点位,依次添加
initializePolyline(forLineID: "A-B")
updatePolyline(forLineID: "A-B", withNewLocation: A点的CLLocation实例)
updatePolyline(forLineID: "A-B", withNewLocation: B点的CLLocation实例)
  • 初始化并动态更新移动车辆线路(黄色):
// 先初始化一次即可
initializePolyline(forLineID: "moving-car")
// 每次获取到车辆新位置时调用
func didReceiveNewCarLocation(_ newLocation: CLLocation) {
    updatePolyline(forLineID: "moving-car", withNewLocation: newLocation)
    updateCurrentPositionMarker(newLocation) // 保留原有的位置标记更新逻辑
}

关键优化点

  • 避免了原代码中每次初始化都创建新GMSPolyline的问题,复用实例保证性能
  • 灵活扩展线路数量,新增线路只需在lineColorConfig中添加配置即可
  • 清晰区分不同线路的路径和样式,逻辑更易维护和调试

内容的提问来源于stack exchange,提问作者user8674636

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.15 04:55:24