H5浏览器获取定位

共有三种方式可以获取定位

1.通过浏览器自带的方法获取

// if (navigator.geolocation) {
//   navigator.geolocation.getCurrentPosition(onSuccess, onError)
// } else {
//   // alert("您的浏览器不支持使用HTML 5来获取地理位置服务");
//   getpagelistdata('', '')
// }
  
// //定位数据获取成功响应
// function onSuccess(position) {
//   var longitude = position.coords.longitude
//   var latitude = position.coords.latitude
//   getpagelistdata(longitude, latitude)
// }
// //定位数据获取失败响应
// function onError(error) {
//   getpagelistdata('', '')
// }
复制代码

2.若为微信浏览器同时配置相应的jdk之后，可以通过自带的方式获取

wx.config({
  appId: configdata.appId, // 必填，公众号的唯一标识
  timestamp: configdata.timestamp, // 必填，生成签名的时间戳
  nonceStr: configdata.nonceStr, // 必填，生成签名的随机串
  signature: configdata.signature, // 必填，签名
  // 必填，需要使用的JS接口列表
  jsApiList: [
    'updateAppMessageShareData',
    'wx-open-launch-app',
    'updateTimelineShareData',
    'getLocation'
  ],
  // 可选，获取开放标签权限
  openTagList: ['wx-open-launch-app'],
})
wx.ready(function () {
  wx.updateAppMessageShareData({
    title: shareTitlephone, // 分享标题
    desc: descContent, // 分享描述
    link: lineLink, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
    imgUrl: imgUrl, // 分享图标
    success: function () {},
    cancel: function () {
      // 用户取消分享后执行的回调函数
    },
  })
  wx.updateTimelineShareData({
    title: shareTitle, // 分享标题
    desc: descContent, // 分享描述
    link: lineLink, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
    imgUrl: imgUrl, // 分享图标
    success: function () {},
    cancel: function () {
      // 用户取消分享后执行的回调函数
    },
  })
  
    wx.getLocation({
      type: "gcj02",
      success: function (res) {
        latitude = res.latitude;
        longitude = res.longitude;
        getpagelistdata(longitude,latitude);
      },
      cancel: function (res) {
        getpagelistdata("","");
        //  alert("定位失败，权限不足")
      },
    });
})
复制代码

通过高德插件获取，此方法适用于PC端

引入高德定位jdk

<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.1&key=*****"></script>
复制代码

html

<div id="container" style="display: none;"></div>
复制代码

js

前端高德地图定位

function baiduapigetaddress(){
    var map = new AMap.Map('container', {
        resizeEnable: true
      });
      //定位
      map.plugin('AMap.Geolocation', function() {
        geolocation = new AMap.Geolocation({
          enableHighAccuracy: true, //是否使用高精度定位，默认:true
          timeout: 10000, //超过10秒后停止定位，默认：无穷大
          noIpLocate: 0,
          maximumAge: 0, //定位结果缓存0毫秒，默认：0
          convert: true, //自动偏移坐标，偏移后的坐标为高德坐标，默认：true
          showButton: false, //显示定位按钮，默认：true
          buttonPosition: 'LB', //定位按钮停靠位置，默认：'LB'，左下角
          buttonOffset: new AMap.Pixel(10, 20), //定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
          showMarker: false, //定位成功后在定位到的位置显示点标记，默认：true
          showCircle: false, //定位成功后用圆圈表示定位精度范围，默认：true
          panToLocation: false, //定位成功后将定位到的位置作为地图中心点，默认：true
          zoomToAccuracy: false //定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
        });
        map.addControl(geolocation);
        geolocation.getCurrentPosition();
        AMap.event.addListener(geolocation, 'complete', onComplete); //返回定位信息
        AMap.event.addListener(geolocation, 'error', onError); //返回定位出错信息
      });
      function onComplete(data) {
        var xcity = data.addressComponent.city; //定位的城市名称
        var province = data.addressComponent.province;//定位的城市名称
        var district = data.addressComponent.district; //定位的城市名称
        var localaddressmess = data.formattedAddress; //定位的城市名称
        localaddress=province+xcity+district;
        // $("#localaddress").val(localaddress);
        // $("#localaddressmess").val(localaddressmess);
        //    recorduseridaddress();
        //经纬度
        var lng = data.position.getLng()
        var lat = data.position.getLat()
        if(lng=="" || lat==""){
          getpagelistdata(lng,lat);
        }else{
          getpagelistdata("","");
        }
      }
      //解析定位错误信息
      function onError(data) {
        //  alert("定位失败")
        getpagelistdata("","");
        var xcity = "" //在这里可以添加一个默认城市，在定位出错之后使用此默认城市（或者返回定位出错）
      }
}
复制代码