欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

微信小程序?qū)崿F(xiàn)獲取準確的騰訊定位地址功能示例

 更新時間:2019年03月27日 11:28:52   作者:程序媛小六  
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)獲取準確的騰訊定位地址功能,結(jié)合實例形式詳細分析了微信小程序使用騰訊地理位置接口的相關(guān)注冊、操作步驟及接口使用技巧,需要的朋友可以參考下

本文實例講述了微信小程序?qū)崿F(xiàn)獲取準確的騰訊定位地址功能。分享給大家供大家參考,具體如下:

官方參考文檔:https://lbs.qq.com/qqmap_wx_jssdk/index.html

逆地址解析(坐標位置描述)

1. 申請開發(fā)者密鑰(key)與設置

個人使用:登錄,點擊“key管理”,進入設置,選擇“WebServiceAPI”,如果沒有小程序ID,勾選“授權(quán)IP”,如果有小程序ID,勾選“域名白名單”,且勾選“微信小程序”,輸入授權(quán)APPID。
https://lbs.qq.com/console/key.html
企業(yè)使用:登錄企業(yè)微信公眾號,選擇“開發(fā)”-“開發(fā)者工具”,開通“騰訊位置服務”,進入后臺管理;點擊“key管理”,進入設置,勾選所需要使用的企業(yè)名下的小程序ID,選擇“WebServiceAPI”,勾選“域名白名單”。

2. 下載微信小程序JavaScriptSDK

3. 添加小程序地理位置說明

2019年1月14日起新提交發(fā)布的版本若未填寫地理位置用途說明,則將無法正常調(diào)用地理位置相關(guān)接口,請及時填寫地理位置用途說明

相關(guān)文檔:https://developers.weixin.qq.com/community/develop/doc/000ea276b44928f7e8d73d0a65b801?idescene=6

在app.json中添加以下代碼

"permission": {
  "scope.userLocation": {
   "desc": "你的位置信息將用于小程序位置接口的效果展示"
  }
}

4. JS 代碼

var QQMapWX = require('../../../page/common/sdk/qqmap-wx-jssdk.js');
var qqmapsdk = new QQMapWX({
 key: 'Key'
});
console.log('signin')
const _this = this;
wx.getLocation({
    type: 'gcj02',
    success: function (res) {
     qqmapsdk.reverseGeocoder({
      location: {
       latitude: res.latitude,
       longitude: res.longitude
      },
      success: function (addressRes) { //成功后的回調(diào)
       var addressRes = addressRes.result;
       console.log( addressRes.address)
        },
      fail: function (error) {
       console.error(error);
      },
      complete: function (addressRes) {
       console.log(addressRes);
      }
     })
    }
})

成功獲取到的信息截圖

微信開發(fā)者工具上進行測試的時候,定位不準確,需要啟用“真機調(diào)試”,在手機上即可準確獲取定位信息。

5. 百度地圖坐標轉(zhuǎn)化JS

實際應用中發(fā)現(xiàn)騰訊地圖定位的坐標不準確,地址正確但定位坐標相差很遠,后期在地圖上進行展示的時候建議使用百度地圖,可以準確的在地圖上顯示。

代碼寫在獲取地址成功調(diào)用里面。

var addressRes = addressRes.result;
var x_pi = 3.14159265358979324 * 3000.0 / 180.0;
var x = parseFloat(addressRes.location.lng);
var y = parseFloat(addressRes.location.lat);
var z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * x_pi);
var theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * x_pi);
var lng = z * Math.cos(theta) + 0.0065;
var lat = z * Math.sin(theta) + 0.006;
console.log(lng)
console.log(lat)

希望本文所述對大家微信小程序設計有所幫助。

相關(guān)文章

  • javascript實現(xiàn)簡單頁面倒計時

    javascript實現(xiàn)簡單頁面倒計時

    這篇文章主要為大家詳細介紹了javascript實現(xiàn)簡單頁面倒計時,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2021-03-03
  • asp.net+js 實現(xiàn)無刷新上傳解析csv文件的代碼

    asp.net+js 實現(xiàn)無刷新上傳解析csv文件的代碼

    無刷新上傳解析csv文件的實現(xiàn)代碼,需要的朋友可以參考下。
    2010-05-05
  • Javascript基于OOP實實現(xiàn)探測器功能代碼實例

    Javascript基于OOP實實現(xiàn)探測器功能代碼實例

    這篇文章主要介紹了Javascript基于OOP實實現(xiàn)探測器功能代碼實例,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下
    2020-08-08
  • 學習JavaScript正則表達式

    學習JavaScript正則表達式

    這篇文章主要介紹了JavaScript正則表達式,詳細深入的了解JavaScript正則表達式,從而更熟練掌握JavaScript正則表達式,感興趣的小伙伴們可以參考一下
    2015-11-11
  • 如何解決webpack-dev-server代理常切換問題

    如何解決webpack-dev-server代理常切換問題

    通常我們有一份webpack.dev.config.js使用webpack-dev-server的proxy,代理到開發(fā)服務器,來解決本地跨域問題。假如項目變大,可能需要proxy到不同環(huán)境,那么如何解決webpack-dev-server代理常切換問題,下面就一起來了解一下
    2019-01-01
  • JavaScript Cookie的讀取和寫入函數(shù)

    JavaScript Cookie的讀取和寫入函數(shù)

    Cookie的讀取和寫入實現(xiàn)函數(shù)。
    2009-12-12
  • uniapp自定義應用退出執(zhí)行內(nèi)容實例代碼

    uniapp自定義應用退出執(zhí)行內(nèi)容實例代碼

    近幾日使用uni-app開發(fā)移動應用APP遇到了個不常見的需求,下面這篇文章主要給大家介紹了關(guān)于uniapp自定義應用退出執(zhí)行內(nèi)容的相關(guān)資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下
    2022-12-12
  • javascript實現(xiàn)dom動態(tài)創(chuàng)建省市縱向列表菜單的方法

    javascript實現(xiàn)dom動態(tài)創(chuàng)建省市縱向列表菜單的方法

    這篇文章主要介紹了javascript實現(xiàn)dom動態(tài)創(chuàng)建省市縱向列表菜單的方法,可實現(xiàn)省市列表菜單效果,涉及javascript鼠標事件及頁面處理json數(shù)據(jù)的技巧,需要的朋友可以參考下
    2015-05-05
  • Javascript中click與blur事件的順序詳析

    Javascript中click與blur事件的順序詳析

    這篇文章主要給大家介紹了關(guān)于Javascript中click與blur事件順序的相關(guān)資料,文中介紹的非常詳細,對大家學習或者使用Javascript中的click與blur事件具有一定的參考學習價值,需要的朋友可以下面來一起看看吧。
    2017-04-04
  • 微信小程序開發(fā)之map地圖實現(xiàn)教程

    微信小程序開發(fā)之map地圖實現(xiàn)教程

    相信大家現(xiàn)在都知道微信小程序吧,下面這篇文章主要給大家介紹了微信小程序開發(fā)之map地圖的相關(guān)資料,分享出來供大家參考學習,文中通過示例代碼介紹的非常詳細,需要的朋友們下面跟著小編來一起學習學習吧。
    2017-06-06

最新評論