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

地图方向线未显示:用户位置至指定地点无路径连线

解决Google Maps API方向路径线不显示的问题

看起来你已经能准确定位到目标点,但连接两者的路径线没出来,大概率是API请求校验、JSON解析或者折线创建环节出了问题,我帮你梳理几个关键排查点和解决方法:

1. 先确认API请求是否有效

首先得保证你的Directions API请求是合规的:

  • 检查请求URL里是否包含origin(用户位置)、destination(目标位置)和有效的API密钥key
  • 去Google Cloud控制台确认Directions API已经启用,并且API密钥没有被IP/域名限制
  • 可以直接把请求URL复制到浏览器打开,查看返回的JSON里status字段是否为OK;如果是INVALID_REQUEST、OVER_QUERY_LIMIT这类值,先解决API层面的问题

2. 正确解析JSON里的路径点

Google Directions API的路径数据嵌套层级比较深,在routes[0].legs[0].steps里,每个step的polyline.points是编码后的字符串,需要解码成坐标数组。你的代码只提到了解析JSON,但可能没正确遍历到核心路径数据。

给你补全解析和路径拼接的完整示例代码:

func DrawDirection(url: String, cord: CLLocationCoordinate2D) {
    request(url).responseJSON { response in
        // 先处理请求错误
        if let error = response.error {
            print("请求失败: \(error.localizedDescription)")
            return
        }
        
        guard let data = response.data,
              let parsed = try? JSONSerialization.jsonObject(with: data, options: []) as? [String: Any] else {
            print("JSON解析失败")
            return
        }
        
        // 检查API返回状态
        guard let status = parsed["status"] as? String, status == "OK" else {
            print("API返回错误: \(parsed["status"] ?? "未知状态")")
            return
        }
        
        // 逐层解析路径数据
        guard let routes = parsed["routes"] as? [[String: Any]],
              let firstRoute = routes.first,
              let legs = firstRoute["legs"] as? [[String: Any]],
              let firstLeg = legs.first,
              let steps = firstLeg["steps"] as? [[String: Any]] else {
            print("未找到有效路径数据")
            return
        }
        
        // 拼接起点和所有step的路径
        let mutablePath = GMSMutablePath()
        mutablePath.add(cord) // 添加用户位置作为起点
        
        for step in steps {
            guard let polylineDict = step["polyline"] as? [String: Any],
                  let encodedPoints = polylineDict["points"] as? String,
                  let stepPath = GMSPath(fromEncodedPath: encodedPoints) else {
                continue
            }
            // 把当前step的所有坐标添加到总路径里
            for index in 0..<stepPath.count() {
                mutablePath.add(stepPath.coordinate(at: index))
            }
        }
        
        // 创建并添加折线到地图
        let directionPolyline = GMSPolyline(path: mutablePath)
        directionPolyline.strokeColor = .systemBlue // 设置折线颜色
        directionPolyline.strokeWidth = 3.0 // 设置折线宽度
        directionPolyline.map = yourMapView // 这里替换成你的GMSMapView实例!
    }
}

3. 确保折线被正确绑定到地图

最容易忽略的细节:创建GMSPolyline后,一定要把它的map属性设置为你的地图实例(比如yourMapView),不然折线只是存在于内存中,不会显示在界面上。

4. 排查路径解码问题

如果API返回的polyline.points解码失败,也会导致路径为空。建议直接用Google Maps SDK提供的GMSPath(fromEncodedPath:)方法解码,比自己写解码逻辑更可靠。

按照上面的步骤逐一排查,应该就能解决路径线不显示的问题啦!

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

相关产品推荐
方舟 Agent Plan

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

最近更新时间:2026.05.22 09:35:31