118 lines
3 KiB
Markdown
118 lines
3 KiB
Markdown
|
# 高德地图小程序集成配置说明
|
|||
|
|
|
|||
|
|
## 1. 申请高德地图API Key
|
|||
|
|
|
|||
|
|
1. 访问高德开放平台：https://lbs.amap.com/dev/
|
|||
|
|
2. 注册开发者账号并实名认证
|
|||
|
|
3. 创建应用，选择"微信小程序"平台
|
|||
|
|
4. 获取API Key，复制到 `config/config.js` 的 `amapKey` 字段
|
|||
|
|
|
|||
|
|
## 2. 配置微信小程序合法域名
|
|||
|
|
|
|||
|
|
在微信小程序后台（mp.weixin.qq.com）的"开发设置"中添加以下合法域名：
|
|||
|
|
|
|||
|
|
**request合法域名：**
|
|||
|
|
- https://restapi.amap.com
|
|||
|
|
|
|||
|
|
**uploadFile合法域名：**
|
|||
|
|
- https://restapi.amap.com
|
|||
|
|
|
|||
|
|
**downloadFile合法域名：**
|
|||
|
|
- https://restapi.amap.com
|
|||
|
|
|
|||
|
|
## 3. 位置权限配置
|
|||
|
|
|
|||
|
|
app.json 中已配置位置权限：
|
|||
|
|
```json
|
|||
|
|
{
|
|||
|
|
"permission": {
|
|||
|
|
"scope.userLocation": {
|
|||
|
|
"desc": "你的位置信息将用于小程序位置接口的效果展示"
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
"requiredBackgroundModes": ["location"],
|
|||
|
|
"requiredPrivateInfos": ["getLocation"]
|
|||
|
|
}
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 4. 使用的功能
|
|||
|
|
|
|||
|
|
当前实现的地图功能包括：
|
|||
|
|
|
|||
|
|
### 基础功能
|
|||
|
|
- GPS定位获取当前位置
|
|||
|
|
- 高德地图逆地理编码（经纬度转地址）
|
|||
|
|
- 地图标记显示
|
|||
|
|
- 位置权限管理
|
|||
|
|
- 定时位置更新
|
|||
|
|
|
|||
|
|
### 高级功能
|
|||
|
|
- 好友位置显示
|
|||
|
|
- 附近用户搜索
|
|||
|
|
- 位置距离计算
|
|||
|
|
- 地图区域自适应
|
|||
|
|
- 位置隐私保护
|
|||
|
|
|
|||
|
|
### API集成
|
|||
|
|
- 与后端位置服务完整对接
|
|||
|
|
- 支持位置上传和好友位置获取
|
|||
|
|
- 附近用户搜索功能
|
|||
|
|
- 位置历史记录
|
|||
|
|
|
|||
|
|
## 5. 文件结构
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
miniprogram/
|
|||
|
|
├── libs/
|
|||
|
|
│ └── amap-wx.js # 高德地图SDK
|
|||
|
|
├── utils/
|
|||
|
|
│ ├── map-config.js # 地图配置和工具类
|
|||
|
|
│ └── api-client.js # API客户端（已添加位置相关方法）
|
|||
|
|
├── pages/map/
|
|||
|
|
│ ├── map.js # 地图页面逻辑
|
|||
|
|
│ ├── map.wxml # 地图页面模板
|
|||
|
|
│ └── map.wxss # 地图页面样式
|
|||
|
|
└── config/
|
|||
|
|
└── config.js # 配置文件（需要添加amapKey）
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 6. 注意事项
|
|||
|
|
|
|||
|
|
1. **API Key安全**：不要将API Key提交到公开仓库
|
|||
|
|
2. **权限引导**：首次使用时会引导用户授权位置权限
|
|||
|
|
3. **网络环境**：高德API需要网络连接，注意处理网络异常
|
|||
|
|
4. **坐标系**：使用GCJ02坐标系（高德地图标准）
|
|||
|
|
5. **性能优化**：位置更新采用30秒间隔，避免频繁请求
|
|||
|
|
|
|||
|
|
## 7. 测试建议
|
|||
|
|
|
|||
|
|
1. 真机测试位置权限和定位功能
|
|||
|
|
2. 测试网络异常情况的处理
|
|||
|
|
3. 验证好友位置显示是否正常
|
|||
|
|
4. 检查地图标记和交互功能
|
|||
|
|
|
|||
|
|
## 8. 故障排除
|
|||
|
|
|
|||
|
|
### 定位失败
|
|||
|
|
- 检查位置权限是否开启
|
|||
|
|
- 确认网络连接正常
|
|||
|
|
- 验证高德API Key是否有效
|
|||
|
|
|
|||
|
|
### 地址解析失败
|
|||
|
|
- 检查合法域名配置
|
|||
|
|
- 确认API Key额度是否充足
|
|||
|
|
- 验证网络请求是否被拦截
|
|||
|
|
|
|||
|
|
### 地图显示异常
|
|||
|
|
- 检查坐标数据格式
|
|||
|
|
- 确认地图组件属性配置
|
|||
|
|
- 验证标记数据结构是否正确
|
|||
|
|
|
|||
|
|
## 9. 扩展功能
|
|||
|
|
|
|||
|
|
可以根据需要添加更多功能：
|
|||
|
|
- 路径规划和导航
|
|||
|
|
- POI搜索
|
|||
|
|
- 地理围栏
|
|||
|
|
- 轨迹回放
|
|||
|
|
- 多种地图图层
|