更新记录

1.0.0（2026-08-30） 下载此版本

1.0.0（2026-08-30）

路线找桩页面模板首版：设定起终点、沿途推荐充电站、途经点导航。路线规划使用高德 Web 服务，Key 由宿主 setKey 配置。

平台兼容性

uni-app(3.8.12)

路线找桩

设定出行起终点和补能间隔，沿驾车路线在里程点上推荐附近充电站，可设为途经点后打开系统地图导航。

不依赖 uView，筛选 / 单选 / 弹层均为页面内 HTML + CSS。

功能说明

1. 用 uni.chooseLocation 选择出发、到达；可交换起终点。
2. 调用高德 Web 服务驾车路径规划，展示预计里程。
3. 填写首次补能、后续间隔（不填则默认 100 km / 150 km），进入路线地图。
4. 地图绘制路线折线（含路况颜色）、起点 / 终点 / 途经点 / 公里点标记。
5. 点击公里点（大于 1000 的 marker id）弹出附近充电站列表。
6. 可按排序、充电类型、停车费用、金额上限、距离、功率下限筛选。
7. 「设为途经点」后重新规划路线；可删除途经点。
8. 「导航」调用 uni.openLocation 打开系统地图。

附近充电站当前为插件内写死的示例数据，不是真实运营站点。

页面

默认示例起终点：广州塔 → 长沙南站。

导入插件时若提示合并 pages_init.json，按提示合并到项目 pages.json 即可。需 HBuilderX 3.5.0 及以上。

未自动合并时，在宿主 pages.json 增加：

{
    "path": "uni_modules/lyf-router-plan/pages/route-setting/route-setting",
    "style": {
        "navigationBarTitleText": "路线找桩",
        "navigationBarBackgroundColor": "#ffffff",
        "backgroundColor": "#f5f5f5"
    }
},
{
    "path": "uni_modules/lyf-router-plan/pages/station-map/station-map",
    "style": {
        "navigationBarTitleText": "附近站场",
        "navigationBarBackgroundColor": "#ffffff",
        "backgroundColor": "#ffffff"
    }
}

使用步骤

1. 配置高德 Key（必做）

路线规划请求：https://restapi.amap.com/v3/direction/driving。插件内不内置 Key。

在宿主 App.vue：

import mapService from '@/uni_modules/lyf-router-plan/js_sdk/map-service.js'

export default {
    onLaunch() {
        mapService.setKey('你的高德Web服务Key')
    }
}

申请地址：高德控制台 Key，服务类型选 Web服务。

未配置 Key 时，页面会提示「请先配置高德 Web 服务 Key」。

2. 打开页面

uni.navigateTo({
    url: '/uni_modules/lyf-router-plan/pages/route-setting/route-setting'
})

3. 操作流程

1. 点击「更换」选择出发 / 到达，或点中间按钮交换起终点。
2. 页面自动请求驾车路线，成功后显示「预计 xx 公里」。
3. 可选填写首次补能、后续间隔，点「匹配充电站」。
4. 在地图上点击公里气泡（如 100km、250km），打开「选择充电站」。
5. 需要时点「筛选」或顶部芯片，再点某站「设为途经点」。
6. 点「导航」打开系统地图；失败时会弹出起终点和途经点文字说明。

补能间隔可在地图页点「修改」再次调整，保存后按新间隔重新打点。

微信小程序配置（必做）

选择起终点使用 uni.chooseLocation。微信按地理位置隐私管理，下面三项需按实际用途配置。

用户隐私保护指引

微信公众平台 → 账号设置 → 服务内容声明 → 用户隐私保护指引，增加位置信息：

若宿主另外调用了 uni.getLocation，再勾选 wx.getLocation。

manifest.json

本插件用了 chooseLocation，必须写入 requiredPrivateInfos。宿主若还调用了 uni.getLocation，再加 getLocation；没用就不要多报。

"mp-weixin": {
    "permission": {
        "scope.userLocation": {
            "desc": "用于选择出行起终点、规划沿途充电站"
        }
    },
    "requiredPrivateInfos": [
        "chooseLocation"
    ]
}

desc 会展示给用户，请写真实用途。改完后重新运行到微信开发者工具。

微信公众平台还需把 https://restapi.amap.com 配进 request 合法域名。

接入真实充电站数据

js_sdk/station-data.js 的 getNearbyStations 返回示例站点（名称、价格、枪口为模板，坐标绕查询点生成）。

对接真实接口时，只改这个方法，保持返回结构即可：

{
    data: {
        records: [{
            siteId: 10001,
            name: '站点名',
            address: '地址',
            valley: '0.78',
            idleGun: 10,
            totalGun: 16,
            pileType: 1,
            stopCar: 0,
            power: 120,
            latitude: 23.12,
            longitude: 113.26,
            distance: 0.6
        }]
    }
}

目录

uni_modules/lyf-router-plan/
  pages/route-setting/     路线设置
  pages/station-map/       附近站场
  js_sdk/map-service.js    高德驾车规划，setKey 注入
  js_sdk/station-data.js   附近站场示例数据
  static/                  起终点 / 途经 / 公里点图标
  pages_init.json          导入时合并到 pages.json

页面之间用本地缓存 key driving-route 传递路线数据。

常见问题

• 提示「请先配置高德 Web 服务 Key」：宿主 App.vue 未调用 mapService.setKey。
• 提示 INVALID_USER_KEY 等：Key 不是 Web 服务类型，或未开通驾车路径规划。
• 小程序 request 失败：未配置 https://restapi.amap.com 合法域名。
• 地图页提示「暂无路线数据」：未先在路线设置页规划成功。