国产 无码 综合区,色欲AV无码国产永久播放,无码天堂亚洲国产AV,国产日韩欧美女同一区二区

微信小程序獲取定位顯示在百度地圖上位置出現(xiàn)偏差

這篇具有很好參考價值的文章主要介紹了微信小程序獲取定位顯示在百度地圖上位置出現(xiàn)偏差。希望對大家有所幫助。如果存在錯誤或未考慮完全的地方,請大家不吝賜教,您也可以點擊"舉報違法"按鈕提交疑問。

項目場景:

背景:

  1. 微信小程序端獲取手機定位坐標,以及正確展示位置
  2. 通過詳細地址解析為定位坐標顯示在小程序端以及PC后臺
  3. 小程序獲取的地理坐標與百度地圖坐標相互轉(zhuǎn)化

相關(guān)知識

目前國內(nèi)主要有以下三種坐標系:

  1. WGS84:為一種大地坐標系,也是目前廣泛使用的GPS全球衛(wèi)星定位系統(tǒng)使用的坐標系。
  2. GCJ02:又稱火星坐標系,是由中國國家測繪局制訂的地理信息系統(tǒng)的坐標系統(tǒng)。由WGS84坐標系經(jīng)加密后的坐標系。
  3. BD09:為百度坐標系,在GCJ02坐標系基礎(chǔ)上再次加密。其中bd09ll表示百度經(jīng)緯度坐標,bd09mc表示百度墨卡托米制坐標。
    非中國地區(qū)地圖,服務坐標統(tǒng)一使用WGS84坐標。
坐標系 使用廠商
大地坐標系(WGS84) GPS定位系統(tǒng)及相關(guān)設(shè)備、谷歌地圖
火星坐標(GCJ02) 高德地圖、阿里云地圖、 騰訊搜搜地圖 、高德MapABC地圖API 、小程序百度地圖
百度坐標(BD09) 百度地圖
圖吧坐標 圖吧MapBar地圖

問題描述

小程序端獲取的坐標顯示在百度地圖上地理位置出現(xiàn)偏差:

解決問題

小程序獲取的定位坐標可選type 有兩種 wgs84 : gps定位坐標, gcj02: 火星定位坐標。

  • type:wgs84返回gps坐標,gcj02 返回可用于wx.openLocation的坐標;
  • altitude:傳入 true 會返回高度信息,由于獲取高度需要較高精確度,會減慢接口返回速度;
    isHighAccuracy:開啟高精度定位;
  • highAccuracyExpireTime:高精度定位超時時間(ms),指定時間內(nèi)返回最高精度,該值3000ms以上高精度定位才有效果;
wx.getLocation({
  // type: 'wgs84', // gps定位 坐標系
  type: 'gcj02', // 重點就是在這里,最好使用這種,對接百度小程序端地址解析 
  success: function(){},
  fail: function(){}
})
  1. 小程序端使用百度地圖api 地址解析為詳細地址 ,傳入的坐標系需要為 gcj02類型,并不是百度坐標系
const bmap = require("../../utils/bmap-wx.js"); // 引入bmap-wx文件
 var BMap = new bmap.BMapWX({
            ak:  "你申請的小程序百度地圖的ak"
 })
 BMap.regeocoding({
      location: res.latitude + ',' + res.longitude,  // 百度api 地址解析,使用的坐標點類型為 gcj02
      success: function (res) {
      		console.log(res.originalData.result.sematic_description)
      },
      fail: function () {}
 })
  1. 小程序端獲取的定位需要轉(zhuǎn)化為百度系坐標用于后端展示,則需要通過一定的算法將gcj02轉(zhuǎn)化為百度坐標,這里有寫好的算法, 大家直接粘貼

WSCoordinate.js

/**
 *  判斷經(jīng)緯度是否超出中國境內(nèi)
 */
function isLocationOutOfChina(latitude, longitude) {
	if (longitude < 72.004 || longitude > 137.8347 || latitude < 0.8293 || latitude > 55.8271)
	  return true;
	return false;
  }
  
  
  /**
   *  將WGS-84(國際標準)轉(zhuǎn)為GCJ-02(火星坐標):
   */
  function transformFromWGSToGCJ(latitude, longitude) {
	var lat = "";
	var lon = "";
	var ee = 0.00669342162296594323;
	var a = 6378245.0;
	var pi = 3.14159265358979324;
  
	if (isLocationOutOfChina(latitude, longitude)) {
	  lat = latitude;
	  lon = longitude;
	}
	else {
	  var adjustLat = transformLatWithXY(longitude - 105.0, latitude - 35.0);
	  var adjustLon = transformLonWithXY(longitude - 105.0, latitude - 35.0);
	  var radLat = latitude / 180.0 * pi;
	  var magic = Math.sin(radLat);
	  magic = 1 - ee * magic * magic;
	  var sqrtMagic = Math.sqrt(magic);
	  adjustLat = (adjustLat * 180.0) / ((a * (1 - ee)) / (magic * sqrtMagic) * pi);
	  adjustLon = (adjustLon * 180.0) / (a / sqrtMagic * Math.cos(radLat) * pi);
	  latitude = latitude + adjustLat;
	  longitude = longitude + adjustLon;
	}
	return { latitude: latitude, longitude: longitude };
  
  }
  
  /**
   *  將GCJ-02(火星坐標)轉(zhuǎn)為百度坐標:
   */
  function transformFromGCJToBaidu(latitude, longitude) {  
	var pi = 3.14159265358979324 * 3000.0 / 180.0;
  
	var z = Math.sqrt(longitude * longitude + latitude * latitude) + 0.00002 * Math.sin(latitude * pi);
	var theta = Math.atan2(latitude, longitude) + 0.000003 * Math.cos(longitude * pi);
	var a_latitude = (z * Math.sin(theta) + 0.006);
	var a_longitude = (z * Math.cos(theta) + 0.0065);
  
	return { latitude: a_latitude, longitude: a_longitude };
  }
  
  /**
   *  將百度坐標轉(zhuǎn)為GCJ-02(火星坐標):
   */
  function transformFromBaiduToGCJ(latitude, longitude) {
	var xPi = 3.14159265358979323846264338327950288 * 3000.0 / 180.0;
  
	var x = longitude - 0.0065;
	var y = latitude - 0.006;
	var z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * xPi);
	var theta = Math.atan2(y, x) - 0.000003 * Math.cos(x * xPi);
	var a_latitude = z * Math.sin(theta);
	var a_longitude = z * Math.cos(theta);
  
	return { latitude: a_latitude, longitude: a_longitude };
  }
  
  /**
   *  將GCJ-02(火星坐標)轉(zhuǎn)為WGS-84:
   */
  function transformFromGCJToWGS(latitude, longitude) {
	var threshold = 0.00001;
  
	// The boundary
	var minLat = latitude - 0.5;
	var maxLat = latitude + 0.5;
	var minLng = longitude - 0.5;
	var maxLng = longitude + 0.5;
  
	var delta = 1;
	var maxIteration = 30;
  
	while (true) {
	  var leftBottom = transformFromWGSToGCJ(minLat, minLng);
	  var rightBottom = transformFromWGSToGCJ(minLat, maxLng);
	  var leftUp = transformFromWGSToGCJ(maxLat, minLng);
	  var midPoint = transformFromWGSToGCJ((minLat + maxLat) / 2, (minLng + maxLng) / 2);
	  delta = Math.abs(midPoint.latitude - latitude) + Math.abs(midPoint.longitude - longitude);
  
	  if (maxIteration-- <= 0 || delta <= threshold) {
		return { latitude: (minLat + maxLat) / 2, longitude: (minLng + maxLng) / 2 };
	  }
  
	  if (isContains({ latitude: latitude, longitude: longitude }, leftBottom, midPoint)) {
		maxLat = (minLat + maxLat) / 2;
		maxLng = (minLng + maxLng) / 2;
	  }
	  else if (isContains({ latitude: latitude, longitude: longitude }, rightBottom, midPoint)) {
		maxLat = (minLat + maxLat) / 2;
		minLng = (minLng + maxLng) / 2;
	  }
	  else if (isContains({ latitude: latitude, longitude: longitude }, leftUp, midPoint)) {
		minLat = (minLat + maxLat) / 2;
		maxLng = (minLng + maxLng) / 2;
	  }
	  else {
		minLat = (minLat + maxLat) / 2;
		minLng = (minLng + maxLng) / 2;
	  }
	}
  
  }
  
  function isContains(point, p1, p2) {
	return (point.latitude >= Math.min(p1.latitude, p2.latitude) && point.latitude <= Math.max(p1.latitude, p2.latitude)) && (point.longitude >= Math.min(p1.longitude, p2.longitude) && point.longitude <= Math.max(p1.longitude, p2.longitude));
  }
  
  function transformLatWithXY(x, y) {
	var pi = 3.14159265358979324;
	var lat = -100.0 + 2.0 * x + 3.0 * y + 0.2 * y * y + 0.1 * x * y + 0.2 * Math.sqrt(Math.abs(x));
	lat += (20.0 * Math.sin(6.0 * x * pi) + 20.0 * Math.sin(2.0 * x * pi)) * 2.0 / 3.0;
	lat += (20.0 * Math.sin(y * pi) + 40.0 * Math.sin(y / 3.0 * pi)) * 2.0 / 3.0;
	lat += (160.0 * Math.sin(y / 12.0 * pi) + 320 * Math.sin(y * pi / 30.0)) * 2.0 / 3.0;
	return lat;
  }
  
  function transformLonWithXY(x, y) {
	var pi = 3.14159265358979324;
	var lon = 300.0 + x + 2.0 * y + 0.1 * x * x + 0.1 * x * y + 0.1 * Math.sqrt(Math.abs(x));
	lon += (20.0 * Math.sin(6.0 * x * pi) + 20.0 * Math.sin(2.0 * x * pi)) * 2.0 / 3.0;
	lon += (20.0 * Math.sin(x * pi) + 40.0 * Math.sin(x / 3.0 * pi)) * 2.0 / 3.0;
	lon += (150.0 * Math.sin(x / 12.0 * pi) + 300.0 * Math.sin(x / 30.0 * pi)) * 2.0 / 3.0;
	return lon;
  }
  
  
  
  module.exports = {
	isLocationOutOfChina: isLocationOutOfChina,
	transformFromWGSToGCJ: transformFromWGSToGCJ,
	transformFromGCJToBaidu: transformFromGCJToBaidu,
	transformFromBaiduToGCJ: transformFromBaiduToGCJ,
	transformFromGCJToWGS: transformFromGCJToWGS
  }

  1. 直接上代碼轉(zhuǎn)化 調(diào)用BMapWX.regeocoding方法進行逆地址解析(從經(jīng)緯度轉(zhuǎn)換為地址信息)
const utils = require("../../utils/WSCoordinate.js")
wx.getLocation({
            // type: 'wgs84', // gps定位 坐標系
            type: 'gcj02', // 重點就是在這里
            success: function (res) {
                // gcj02 轉(zhuǎn)換成百度地圖坐標,用于傳給PC端 百度地圖展示
                const marker = utils.transformFromGCJToBaidu(res.latitude, res.longitude)
                that.setData({
                    locationFlag: false,
                    map_latitude: marker.latitude,
                    map_longitude: marker.longitude
                })
                BMap.regeocoding({
                    location: res.latitude + ',' + res.longitude,
                    success: function (res) {
                        that.setData({
                            desLocation: res.originalData.result.sematic_description
                        })
                    },
                    fail: function () {
                        wx.showToast({
                            title: '請檢查位置服務是否開啟',
                        })
                    },
                });
            },
            fail: function () {
                console.log('fail:', '授權(quán)失敗')
                            
            }
        })

5 地址解析(從地址轉(zhuǎn)換為坐標)文章來源地址http://www.zghlxwxcb.cn/news/detail-763100.html

const bmap = require("../../lib/bmap-wx.js"); // 引入bmap-wx文件
const util = require('../../lib/WSCoordinate.js')  
 // 新建百度地圖對象
        var BMap = new bmap.BMapWX({
            ak: "你的ak", // 你的ak
        });
         // 發(fā)起geocoding檢索請求
        BMap.geocoding({
            address: address, // 輸入詳細地址            
            success: (data) => {  // 獲取的坐標為 gcj02坐標,并不是百度坐標,需要轉(zhuǎn)換為百度坐標
            const wxMarkerData = data.wxMarkerData[0]
            // 將GCJ-02(火星坐標)轉(zhuǎn)為百度坐標
            let resultMarker = util.transformFromGCJToBaidu( wxMarkerData.latitude, wxMarkerData.longitude)
            // console.log(resultMarker, 'resultMarker')
            this.setData({
                latitude: resultMarker.latitude, // 緯度
                longitude: resultMarker.longitude // 經(jīng)度
            })
        },
        fail: (error) => { 
            console.log('error:', error)
        },
})
       
       
    

到了這里,關(guān)于微信小程序獲取定位顯示在百度地圖上位置出現(xiàn)偏差的文章就介紹完了。如果您還想了解更多內(nèi)容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!

本文來自互聯(lián)網(wǎng)用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權(quán),不承擔相關(guān)法律責任。如若轉(zhuǎn)載,請注明出處: 如若內(nèi)容造成侵權(quán)/違法違規(guī)/事實不符,請點擊違法舉報進行投訴反饋,一經(jīng)查實,立即刪除!

領(lǐng)支付寶紅包贊助服務器費用

相關(guān)文章

覺得文章有用就打賞一下文章作者

支付寶掃一掃打賞

博客贊助

微信掃一掃打賞

請作者喝杯咖啡吧~博客贊助

支付寶掃一掃領(lǐng)取紅包,優(yōu)惠每天領(lǐng)

二維碼1

領(lǐng)取紅包

二維碼2

領(lǐng)紅包