微信小程序开发- 位置API 学习笔记

核心知识点（对应 案例代码包里 所有场景）

1. 核心定位 API（对应 demo01、demo02）

表格

2. 地图组件高级控制（对应 demo03）

• 核心前提：必须在页面 onReady 生命周期中，通过wx.createMapContext("mapId")创建地图上下文（mapId 对应 wxml 中 map 标签的 id）。
• 常用控制方法（对应 demo03 各子页面）：
  1. getCenterLocation：获取地图当前中心点经纬度
  2. moveToLocation：将地图视角移动到用户当前定位
  3. translateMarker：动画平移地图上的标记点（如模拟轨迹）
  4. includePoints：调整地图视角，让多个坐标点都显示在视野内
  5. getRegion：获取地图当前视野范围（东北 / 西南角坐标）
  6. getScale：获取地图当前缩放级别（数值越大，显示越详细）

3. 权限配置（报错关键，对应正确 app.json）

（1）权限配置（app.json 中）

"permission": { "scope.userLocation": { "desc": "用于获取您的位置信息" // 授权提示语，不可省略 } }

（2）隐私接口声明（app.json 中）

"requiredPrivateInfos": [ "getLocation", "chooseLocation" // 仅这两个，openLocation无需声明（易错点） ]

（3）其他可选配置

"requiredBackgroundModes": ["location"], // 后台定位（可选，按需添加） "lazyCodeLoading": "requiredComponents" // 适配苹果手机，避免定位失效

学习内容：

一、基础位置获取（demo01）

1. wx.getLocation

• 功能：获取设备当前的地理位置信息
• 获取数据：经度、纬度、速度、定位精度
• 使用前提：需要用户授权定位权限
• 坐标系：必须使用 gcj02 火星坐标系

2. wx.chooseLocation

• 功能：打开微信地图界面，手动选择一个位置
• 获取数据：位置名称、详细地址、经度、纬度
• 特点：自带地图搜索、选点功能，无需自行开发地图界面
• 使用前提：需要用户授权定位权限

二、 查看位置（demo02）

wx.openLocation

• 功能：调用微信内置地图，查看指定的地理位置
• 作用：展示目标位置，支持导航、查看周边等功能
• 使用依赖：必须先获取经纬度（通常搭配 getLocation 使用）
• 特点：无需声明隐私接口，无需创建地图组件，直接调用

三、地图组件高级控制(demo03)

核心前提

• 必须使用<map>地图组件
• 必须在页面onReady生命周期创建地图上下文对象mapCtx

1. getCenterLocation

• 功能：获取当前地图显示区域的中心点经纬度

2. moveToLocation

• 功能：将地图视角移动到当前用户定位位置
• 效果：地图自动居中并显示用户所在位置

3. translateMarker

• 功能：平移动地图上的标记点（marker）
• 特点：支持动画效果，可模拟标记点移动轨迹

4. includePoints

• 功能：自动调整地图视野，使多个坐标点全部显示在屏幕内
• 适用场景：展示多个点位、路线、多门店等

5. getRegion

• 功能：获取当前地图的视野范围
• 返回数据：东北角、西南角经纬度坐标

6. getScale

• 功能：获取当前地图的缩放级别
• 说明：缩放值越大，地图显示越详细

四、核心知识点

1. 权限配置：必须在 app.json 声明定位权限描述
2. 隐私接口：getLocation、chooseLocation 必须在 requiredPrivateInfos 中声明
3. 坐标系统一：所有定位相关功能必须使用 gcj02 坐标系
4. 生命周期：地图上下文必须在 onReady 中创建
5. 真机调试：定位、地图等功能必须在真机上正常运行，模拟器有限制