文章插圖
文末有源碼最近好多同學(xué)問(wèn)石頭哥附近的人如何實(shí)現(xiàn) 。今天呢，就借助這篇文章，給大家做一個(gè)系統(tǒng)的解答 。
老規(guī)矩，先看效果圖
可以看到我們?cè)诘貓D上顯示了附近的一些標(biāo)記點(diǎn) 。
接下來(lái)就教大家如何實(shí)現(xiàn)附近的位置 。
一，創(chuàng)建數(shù)據(jù)首先我們查詢(xún)附近的人的時(shí)候，需要先有附近人的位置，也就是經(jīng)緯度 。這里我以幾個(gè)城市的經(jīng)緯度為例 。

大家可以自行百度查找你所需要的經(jīng)緯度 。
這里經(jīng)緯度查到后，我們需要把這些位置信息存到數(shù)據(jù)庫(kù)里 。
1，注意存位置時(shí)必須是Point類(lèi)型
如上圖所示，我們可以直接在云開(kāi)發(fā)數(shù)據(jù)庫(kù)里添加位置信息，類(lèi)型是geopoint類(lèi)型 。
如我添加的北京的位置如下

這里按照這樣的類(lèi)型，自己多添加幾個(gè)城市的經(jīng)緯度 。當(dāng)然現(xiàn)實(shí)開(kāi)發(fā)中，應(yīng)該是添加附近人的位置(經(jīng)緯度)
2，批量添加(選看)如果感覺(jué)一個(gè)添加比較麻煩的話(huà)，可以先添加一條，然后導(dǎo)出為json，自己在json里批量編輯 。

一定要注意_id不能重復(fù)，格式要保持一致 。這樣你批量編輯后，再把這個(gè)json重新導(dǎo)入到數(shù)據(jù)即可 。

批量導(dǎo)入不是本節(jié)的重點(diǎn)，就不在講解 。我這里默認(rèn)你已經(jīng)添加好位置信息了
3，修改數(shù)據(jù)表權(quán)限我們這里要讓所有人可以讀取到數(shù)據(jù)，必須設(shè)置權(quán)限如下
4，創(chuàng)建對(duì)應(yīng)字段的索引(**重要)我們?nèi)绻氩檎椅恢眯畔?，必須設(shè)置存位置的對(duì)應(yīng)字段對(duì)應(yīng)的索引才可以 。
如果不創(chuàng)建索引直接查詢(xún)，會(huì)報(bào)如下錯(cuò)誤 。

所以我們必須要先創(chuàng)建對(duì)應(yīng)的索引 。如下圖所示添加索引

然后做如下設(shè)置即可

到這里準(zhǔn)備工作就做完了 。
二，查找附近的人我們查找附近的人，肯定是想按照排序由近到遠(yuǎn)的顯示附近的人在地圖上，所以這里我們就要用到geoNear做聚合查詢(xún) 。
geonear查詢(xún)有兩種方式，建議大家用Aggregate.geoNear

詳細(xì)介紹大家可以自己去看官方文檔
https://developers.weixin.qq.com/miniprogram/dev/wxcloud/reference-sdk-api/database/aggregate/Aggregate.geoNear.html
用這個(gè)的主要好處是，我們可以拿到附近人離自己的距離

這個(gè)距離在做附近的人時(shí)很重要的 。既然可以直接拿到，能省很多事的 。具體的代碼后面給大家列出來(lái)，我們先繼續(xù)往下學(xué)習(xí)
三，獲取當(dāng)前的位置我們要做附近的人肯定要先獲取自己的位置，獲取自己的位置就用wx.getLocation即可，對(duì)應(yīng)文檔如下
https://developers.weixin.qq.com/miniprogram/dev/api/location/wx.getLocation.html
這個(gè)使用之前必須要在app.json里注冊(cè)權(quán)限，如果不注冊(cè)權(quán)限，就會(huì)報(bào)如下提示

所以在app.json里寫(xiě)如下代碼
"permission": {"scope.userLocation": {"desc": "獲取位置所需要的權(quán)限"}}
四，獲取附近人的經(jīng)緯度代碼其實(shí)很簡(jiǎn)單，如下

這樣我們就可以按照由近到遠(yuǎn)的順序獲取附近的人了，結(jié)果如下

石頭哥是在杭州，可以看到幾個(gè)城市里離杭州最近的是上海159公里的距離 。
五，在地圖上顯示附近的人既然位置都已經(jīng)查詢(xún)到了，我們就可以在地圖上顯示了，地圖上顯示用到了map組件的markers

對(duì)應(yīng)的js代碼如下

下面我把完整的代碼貼出來(lái)給到大家
wxml代碼
js代碼Page({data: {markers: []},onl oad() {wx.getLocation({ //1，獲取自己的位置type: 'wgs84',success: res => {const latitude = res.latitudeconst longitude = res.longitudeconsole.log('當(dāng)前在杭州的經(jīng)緯度', res.longitude, res.latitude)//2，查找附近的人let markers = []const db = wx.cloud.database()const $ = db.command.aggregatedb.collection('location').aggregate().geoNear({distanceField: 'juli', // 與給定點(diǎn)的距離spherical: true,near: db.Geo.Point(longitude, latitude), //當(dāng)前自己的位置}).end().then(res => {console.log('位置', res)res.list.forEach(item => {markers.push({longitude: item.location.coordinates[0],latitude: item.location.coordinates[1]})})// 地圖上的標(biāo)記點(diǎn)this.setData({markers})})}})}})

• 上一頁(yè)
• 1
• 2
• 下一頁(yè)

以上關(guān)于本文的內(nèi)容，僅作參考！溫馨提示：如遇健康、疾病相關(guān)的問(wèn)題，請(qǐng)您及時(shí)就醫(yī)或請(qǐng)專(zhuān)業(yè)人士給予相關(guān)指導(dǎo)!

「愛(ài)刨根生活網(wǎng)」www.malaban59.cn小編還為您精選了以下內(nèi)容，希望對(duì)您有所幫助：

• 2021口碑最好的手機(jī)前十位 性?xún)r(jià)比高的小米手機(jī)
• 變成你的那一天有小說(shuō)嗎
• 小孩打預(yù)防針掛什么科
• 榴蓮要挑刺大的還是小的
• 西瓜是切小塊冰還是大塊
• DNF手游經(jīng)濟(jì)系統(tǒng)重做，小號(hào)搬磚養(yǎng)大號(hào)，0氪畢業(yè)不是夢(mèng)
• 野柿子直接吃嗎
• 買(mǎi)手機(jī)太小氣會(huì)吃虧！有錢(qián)盡量一步到位，這3款國(guó)產(chǎn)旗艦值得選擇
• 零是不是自然數(shù)
• 刑偵日記楊碧芯看到的小女孩和旗袍女人是誰(shuí)