小程序高德地图定位省市区玩法全攻略

2023-05-05 03:04:29

利用高德地图API轻松获取省市区：小程序定位实战指南

简介

在小程序开发中，获取用户位置信息往往是必不可少的。本文将手把手教你如何利用高德地图提供的API，轻松获取用户的省市区信息。

引入高德地图API

第一步，将高德地图提供的amap-wx.130.js文件下载并放置在小程序项目根目录。随后，在app.js文件中引入该文件：

var amapFile = require('./amap-wx.130.js');

配置定位

在app.js文件中，配置小程序的定位信息：

{
  "window": {
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "微信小程序",
    "navigationBarTextStyle": "black"
  },
  "provider": "wx",
  "getLocation": true
}

获取省市区

在需要获取省市区的位置，使用高德地图提供的wx.getLocation()方法获取当前位置的经纬度。然后，使用高德地图提供的wx.getPoiInfo()方法，根据经纬度获取省市区信息：

wx.getLocation({
  type: 'gcj02', // 返回可以用于wx.openLocation的经纬度
  success: function(res) {
    const latitude = res.latitude;
    const longitude = res.longitude;
    wx.getPoiInfo({
      latitude,
      longitude,
      poi_options: 'policy=1',
      success: function(res) {
        const province = res.result.regeocode.addressComponent.province;
        const city = res.result.regeocode.addressComponent.city;
        const district = res.result.regeocode.addressComponent.district;
        console.log(`省：${province}, 市：${city}, 区：${district}`);
      },
      fail: function(res) {
        console.log(`获取省市区失败：${res}`);
      }
    });
  },
  fail: function(res) {
    console.log(`获取经纬度失败：${res}`);
  }
});