引言
1.1「騰訊位置服務(wù)」是什么？
立足生態(tài)，連接未來
騰訊位置服務(wù)平臺依托龐大的數(shù)據(jù)生態(tài)，以定位、地圖展示、地點搜索、路線規(guī)劃、導(dǎo)航、室內(nèi)圖、海外圖等位置服務(wù)能力和LBS大數(shù)據(jù)能力為基礎(chǔ)，面向開發(fā)者提供方便、易用、高效的LBS服務(wù)產(chǎn)品。當(dāng)前騰訊位置服務(wù)數(shù)據(jù)能力已覆蓋10億人的位置行為數(shù)據(jù)、日均超過600億次的定位調(diào)用、每日支持1億次位置檢索。
1.2「騰訊位置服務(wù)」可應(yīng)用的場景？
隨著功能的日益完善，騰訊位置服務(wù)可適用的場景也越來越多，如?物流業(yè)務(wù)、智能出行、o2o業(yè)務(wù)、共享單車、運動健康、LBS游戲服務(wù)等行業(yè)均可見騰訊位置服務(wù)的身影。筆者也將通過此文展示下騰訊位置服務(wù)在?智能出行行業(yè)的應(yīng)用與實踐。
需求背景
自從2017年微信上線小程序以來，小程序已經(jīng)迅速成長為一個巨大的生態(tài)，吸引各行各業(yè)的開發(fā)者或服務(wù)商參與其中。小程序與線下場景的結(jié)合也日益緊密，其中，乘車二維碼微信小程序無疑讓人們的出行服務(wù)變的更加簡單、快捷。先乘車，后扣費，無論手機(jī)是否聯(lián)網(wǎng)，是否有信號，都可以很順暢的進(jìn)行乘車。
2.2 完善「乘車二維碼」微信小程序
有了最基本的「乘車二維碼」功能對用戶體驗來說，還是遠(yuǎn)遠(yuǎn)不夠的，為此，從用戶體驗的角度出發(fā)，我們逐漸新增了一些實用的功能，比如查詢附近的公交信息、用戶路線規(guī)劃等。也正因為新增了這些實用性的功能，我們發(fā)現(xiàn)「乘車二維碼」微信小程序在數(shù)據(jù)表現(xiàn)(如日活、留存、使用時長)方面更加出色了，「騰訊位置服務(wù)」也成為我們「乘車二維碼」微信小程序內(nèi)不可或缺的角色。
接下來，筆者將通過?公交地圖、路線規(guī)劃兩個功能點更加詳細(xì)的介紹「騰訊位置服務(wù)」中的微信小程序 Java SDK、微信小程序插件。
公交地圖
3.1 效果預(yù)覽
3.2 技術(shù)點分析
在上面的效果預(yù)覽圖中，我們不難發(fā)現(xiàn)，實現(xiàn)公交地圖功能主要包含以下技術(shù)要點：
- 獲取用戶當(dāng)前位置信息
- 通過坐標(biāo)點獲取附近公交信息
- 地圖展示、標(biāo)注
3.3 技術(shù)點實現(xiàn)
3.3.1 獲取用戶當(dāng)前位置信息
我們可以通過微信小程序官方提供的api：wx.getLocation，來獲取用戶的當(dāng)前位置坐標(biāo)點信息：
wx.getLocation({
type:?‘gcj02’,
success (res) {
const latitude = res.latitude
const longitude = res.longitude
}
})
這里我們將 type 指定為 gcj02 獲取到的坐標(biāo)點信息可在后續(xù)接口中直接使用，相對應(yīng)的，如果將 type 指定為 wgs84，后續(xù)我們需要進(jìn)一步進(jìn)行坐標(biāo)轉(zhuǎn)換。
還有個需要注意的是，該接口需要經(jīng)過用戶授權(quán)同意才能調(diào)用，因此我們需要在 app.json 文件中新增相關(guān)配置：
// app.json
“permission”: {
“scope.userLocation”: {
“desc”:?“你的位置信息將用于查詢公交信息”
}
}
3.3.2 獲取附近公交信息
附近公交數(shù)據(jù)哪里來？
這里我們便用到了微信小程序原生LBS能力的最佳拍檔– 微信小程序Java SDK。
騰訊位置服務(wù)為微信小程序提供了基礎(chǔ)的標(biāo)點能力、線和圓的繪制接口等地圖組件和位置展示、地圖選點等地圖API位置服務(wù)能力支持，使得開發(fā)者可以自由地實現(xiàn)自己的微信小程序產(chǎn)品。在此基礎(chǔ)上，騰訊位置服務(wù)微信小程序Java SDK是專為小程序開發(fā)者提供的LBS數(shù)據(jù)服務(wù)工具包，可以在小程序中調(diào)用騰訊位置服務(wù)的POI檢索、關(guān)鍵詞輸入提示、地址解析、逆地址解析、行政區(qū)劃和距離計算等數(shù)據(jù)服務(wù)，讓您的小程序更強(qiáng)大！
接下來筆者將展示如何通過微信小程序Java SDK獲取附近公交的信息。
1. 開通「騰訊位置服務(wù)」：在微信小程序后臺依次選擇?開發(fā)->開發(fā)者工具->騰訊位置服務(wù)，然后點擊開通按鈕，按照提示為您的小程序開通「騰訊位置服務(wù)」
2. 申請開發(fā)者密鑰(key)：申請密鑰（https://lbs.qq.com/dev/console/key/manage）
3. 安全域名設(shè)置：在在微信小程序后臺依次選擇設(shè)置->開發(fā)設(shè)置中設(shè)置request合法域名，添加 https://apis.map.qq.com
4. 下載微信小程序 Java SDK：微信小程序JavaSDK v1.2（http://3gimg.qq.com/lightmap/xcx/jssdk/qqmap-wx-jssdk1.2.zip）
5. 小程序使用：
//index.js
// 引入 Java SDK 核心類
letQQMapWX =?require(?‘../../libs/qqmap-wx-jssdk.js’);
letqqmapsdk;
Page({
:?function{
// 實例化API核心類
qqmapsdk =?newQQMapWX({
key:?‘申請的key’
});
},
onShow:?function{
// 調(diào)用接口
qqmapsdk.search({
keyword:?‘公交車站’,
location:?‘28.636767,115.855820’,
filter:?‘category=公交站’,
success:?function(?res)?{
console.log(res);
},
fail:?function(?res)?{
console.log(res);
},
complete:?function(?res)?{
console.log(res);
}
});
}
})
返回結(jié)果：
可以看到，我們已經(jīng)拿到了我們想要的公交數(shù)據(jù)，接下來將公交數(shù)據(jù)在地圖上標(biāo)注展示出來。
3.3.3 地圖展示、標(biāo)注
公交信息的展示使用到了「騰訊位置服務(wù)」為小程序提供的 map 組件，我們需要將公交信息組裝成 markers 從而繪制到地圖組件上。
關(guān)于地圖組件的具體使用可參考官方文檔：map組件的使用（https://developers.weixin.qq.com/miniprogram/dev/component/map.html）
3.4 小結(jié)
可以看到，我們通過?微信小程序Java SDK可以很輕松的獲取到附近的公交信息。當(dāng)然，?微信小程序Java SDK的能力也遠(yuǎn)遠(yuǎn)不僅于此，它還提供很多實用性的功能滿足多種使用場景：
| 方法 | 說明 |
|---|---|
| search(options:Object) | 地點搜索，搜索周邊poi，比如：“酒店” “餐飲” “娛樂” “學(xué)校” 等等 |
| getSuggestion(options:Object) | 用于獲取輸入關(guān)鍵字的補(bǔ)完與提示，幫助用戶快速輸入 |
| reverseGeocoder(options:Object) | 提供由坐標(biāo)到坐標(biāo)所在位置的文字描述的轉(zhuǎn)換。輸入坐標(biāo)返回地理位置信息和附近poi列表 |
| geocoder(options:Object) | 提供由地址描述到所述位置坐標(biāo)的轉(zhuǎn)換，與逆地址解析的過程正好相反 |
| direction(options:Object) | 提供駕車，步行，騎行，公交的路線規(guī)劃能力 |
| getCityList | 獲取全國城市列表數(shù)據(jù) |
| getDistrictByCityId(options:Object) | 通過城市ID返回城市下的區(qū)縣 |
| calculateDistance(options:Object) | 計算一個點到多點的步行、駕車距離 |
詳細(xì)使用可參考官方文檔：微信小程序Java SDK 使用方法（https://lbs.qq.com/qqmap_wx_jssdk/qqmapwx.html）
需要注意的是，每個key的每個服務(wù)接口的調(diào)用量都有日調(diào)用量：1萬次/Key、并發(fā)數(shù)：5次/key/秒的限制，如若您的微信小程序使用量超出這個限制，可通過控制臺->配額申請（https://lbs.qq.com/dev/console/quota/applyList）中免費申請你需要的配額。
路線規(guī)劃
如果說，「乘車二維碼」微信小程序讓人們的出行變得更加簡單、快捷。
那么，路線規(guī)劃插件則為人們怎么出行提供了最優(yōu)解。
4.1 效果預(yù)覽
4.2 路線規(guī)劃插件
騰訊位置服務(wù)路線規(guī)劃插件 提供路線規(guī)劃等功能，根據(jù)起終點，多種出行方式智能規(guī)劃最佳出行路線及詳情。開發(fā)者可以將路線規(guī)劃插件嵌入到自建小程序的頁面里，實現(xiàn)路線規(guī)劃功能。
可以看到，通過使用路線規(guī)劃插件，我們可以很方便的在我們「乘車二維碼」微信小程序內(nèi)完成路線規(guī)劃功能，接入步驟也較為簡單，主要分為以下幾步：
- 插件申請接入： 在微信小程序后臺管理平臺中，依次選擇 設(shè)置->第三方服務(wù)->插件管理 里點擊添加插件，搜索 騰訊位置服務(wù)路線規(guī)劃 申請，審核通過后，小程序開發(fā)者可在小程序內(nèi)使用該插件。
- 引入插件包：
- // app.json “plugins” : { “routePlan” : { “version” : “1.0.5” , “provider” : “wx50b5593e81dd937a” } } 設(shè)置定位授權(quán): // app.json “permission” : { “scope.userLocation” : { “desc” : “你的位置信息將用于小程序定位” } }
- 使用插件： let key = ‘申請的key’ ; //使用在騰訊位置服務(wù)申請的key let referer = ” ; //調(diào)用插件的app的名稱 let endPoint = JSON .stringify({ //終點 ‘name’ : ‘八一廣場’ , ‘latitude’ : 28.673400 , ‘longitude’ : 115.904500 }); wx.navigateTo({ url : ‘plugin://routePlan/index?key=’ + key + ‘&referer=’ + referer + ‘&endPoint=’ + endPoint });
在集成路線規(guī)劃插件后，進(jìn)一步豐富了我們「乘車二維碼」微信小程序的使用場景，現(xiàn)在，用戶可以在不使用地圖類App的情況下進(jìn)行最優(yōu)路線規(guī)劃，躲避擁堵，方便又快捷。
4.3 小結(jié)
「騰訊位置服務(wù)」提供的微信小程序插件，可以說讓微信小程序一步擁有地圖功能，大大的減少了我們開發(fā)的工作量、提升用戶體驗、增加了小程序的使用場景。
目前，「騰訊位置服務(wù)」已經(jīng)為我們提供了三款實用性插件：
- 路線規(guī)劃： 根據(jù)起點、終點，智能規(guī)劃最佳出行路線，并支持多種出行方式。
- 地鐵圖： 支持全國所有城市地鐵線路靜態(tài)展示、信息查詢、線路檢索及規(guī)劃等功能。
- 地圖選點： 快速、準(zhǔn)確地選擇并確認(rèn)自己的當(dāng)前位置，并將相關(guān)位置信息回傳給開發(fā)者。
具體可查看官方文檔：微信小程序插件（https://lbs.qq.com/miniprogram_plugin/index.html）。
相信后續(xù)也會為我們提供更多功能的插件。
本文原地址：http://www.dawoos.com/331.html
鄭重聲明內(nèi)容版權(quán)聲明：除非注明，否則皆為本站原創(chuàng)文章。如有侵權(quán)聯(lián)系進(jìn)行刪除！
