微信JSSDK获取当前地理位置信息

最近在研究微信JS-SDK文档中的地理位置接口部分，小有心得，在此和大家分享一下。

首先是JSSDK的接入，可参照官方文档来做，在此略过。

下面进入本文的正题：如果获取当前地理位置的信息，包括经纬度和位置详细信息，并在微信公众号页面中打开当前位置的地图，步骤如下：

1.在页面上放置一个按钮，用来点击触发获取地理位置接口的事件：

获取地理位置接口

id="getLocation">getLocation

2.在js里，在wx.ready(function(){})函数里写一个上面按钮的点击事件，用来获取当前位置

的地理位置：

document.querySelector('#getLocation').onclick = function () {

wx.getLocation({

type: 'gcj02', // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入'gcj02'

success: function (res) {

var latitude = titude; // 纬度，浮点数，范围为90 ~ -90

var longitude = res.longitude; // 经度，浮点数，范围为180 ~ -180。

var speed = res.speed; // 速度，以米/每秒计

var accuracy = res.accuracy; // 位置精度

$.ajax({

url:

"/ws/geocoder/v1/?location="+latitude+","+longitude+"&coor d_type=5&key=你自己的腾讯开放平台的开发者秘钥&output=jsonp&callback=calllocation", type: "GET",

dataType:'jsonp',

jsonp:'calllocation'

});

},

cancel: function (res) {

alert('用户拒绝授权获取地理位置');

}

});

};

上面代码中，有几点需要主意：wx.getLocation接口中需要传入的参数type必须是gcj02;$.ajax()方法的url是腾讯地图开放平台中WebServiceAPI的逆地理解析的接口url，地址是：/ws/geocoder/v1/，参数location取经纬度，纬度在前，经度在后，coord_type是坐标系类型，在此取5，表示腾讯地图的坐标系，因为是远程跨域请求，所以output取jsonp,callback的值是自定义函数的名称，key是腾讯开放平台的开发者秘钥，需要在腾讯开放平台去申请，调用远程接口的ajax请求必须是GET请求。这个请求的返回值会在回调函数calllocation里获取：

function calllocation(data){

var name=data.result.formatted_addresses.rough;

var address=data.result.formatted_addresses.recommend;

var lat=t;

var lng=data.result.location.lng;

wx.openLocation({

latitude: lat, // 纬度，浮点数，范围为90 ~ -90

longitude: lng, // 经度，浮点数，范围为180 ~ -180。

name: name, // 位置名

address: address, // 地址详情说明

scale: 18, // 地图缩放级别,整形值,范围从1~28。默认为最大

infoUrl: ''// 在查看位置界面底部显示的超链接,可点击跳转

});

}

在回调函数里根据返回值获取到经纬度坐标，位置名称，位置详细地址后，再调用wx.openLocation()接口在页面上打开此位置的地图，从地图中可看到此位置，以红色标记标出，还有名称和地址在地图下方显示出来。

最后，打开地图这个效果要在手机微信公众号中才能看到，PC微信中是看不到的。