如果在小程序中需要使用定位相關(guān)的操作赁咙，前提是需要在小程序后臺(tái)進(jìn)行申請(qǐng)開通
申請(qǐng)頁(yè)
但是這個(gè)"獲取當(dāng)前的地理位置灭衷、速度"的權(quán)限申請(qǐng)的通過率比較低毅否，有的開發(fā)朋友可能會(huì)來(lái)來(lái)回回折騰十幾次甚至幾十次仍然未通過显拳，這里提供一個(gè)快速申請(qǐng)通過的新思路窿克，經(jīng)過測(cè)試棕硫，"打開地圖選擇位置"接口權(quán)限的通過率遠(yuǎn)遠(yuǎn)高于"獲取當(dāng)前的地理位置髓涯、速度",而且"打開地圖選擇位置"同時(shí)也就獲取了定位權(quán)限。所以可以曲線救國(guó)哈扮，多申請(qǐng)一個(gè)權(quán)限即可纬纪。
下面我將提供一個(gè)符合"打開地圖選擇位置"的頁(yè)面，可以用來(lái)應(yīng)付審核滑肉。
大概頁(yè)面樣式如下：
門店頁(yè)
代碼實(shí)現(xiàn)：
storeMap.wxml
<!--pages/storeMap/storeMap.wxml-->
<view class="main" style="height:{{mapHeight}}px;">
<map class="map" style="height:{{mapHeight}}px;" id="map" longitude="{{location.longitude}}" latitude="{{location.latitude}}" markers="{{markers}}" bindmarkertap="makertap" bindregionchange="regionchange" show-location>
<cover-view class="map-cover">
<cover-image class="map-cover-img" src="../../image/icon-location.png" catchtap="setUserLocation"></cover-image>
</cover-view>
<cover-view class="map-cover-5" catchtap="" wx-if="{{showChoosedStoreInfo}}" catchtap="aedDetail">
<cover-image class="choosed-store-info-img" src="https://img1.baidu.com/it/u=1070662155,3808653193&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1669309200&t=d42000cb6ada37face9f0ec85e48aa21"></cover-image>
<cover-image class="choosed-store-info-icon" src="../../image/current-location.png"></cover-image>
<cover-view class="choosed-store-info-detail">{{choosedStore.title}}</cover-view>
<cover-view class="choosed-store-info-button" catchtap="goThere">去店里</cover-view>
</cover-view>
</map>
</view>
storeMap.js
// pages/storeMap/storeMap.js
Page({
/**
* 頁(yè)面的初始數(shù)據(jù)
*/
data: {
mapHeight: 0,
markers:[],
//默認(rèn)的門店信息包各，如果有需要，可以從接口獲取
markersDefault: [{
iconPath: "../../image/ic_store.png",
id: 1,
longitude: 121.523315,
latitude: 31.292936,
width:30,
height:30,
title: "楊浦區(qū)五角場(chǎng)店"
},{
iconPath: "../../image/ic_store.png",
id: 2,
longitude: 116.375381,
latitude: 40.025043,
width:30,
height:30,
title: "北京奧林匹克運(yùn)動(dòng)會(huì)店"
},{
iconPath: "../../image/ic_store.png",
id: 3,
longitude: 114.115030,
latitude: 22.537600,
width:30,
height:30,
title: "深圳萬(wàn)象城門店"
},{
iconPath: "../../image/ic_store.png",
id: 4,
longitude: 121.803829,
latitude: 31.136933,
width:30,
height:30,
title: "上海浦東國(guó)際機(jī)場(chǎng)店"
},{
iconPath: "../../image/ic_store.png",
id: 5,
longitude: 121.447288,
latitude: 31.146777,
width:30,
height:30,
title: "上海植物園店"
}
],
location:{},
showChoosedStoreInfo: false, // 顯示選中的門店信息
choosedStore: {},
},
/**
* 生命周期函數(shù)--監(jiān)聽頁(yè)面加載
*/
onLoad(options) {
//初始化屏幕信息
wx.getSystemInfo({
complete: (sysinfo) => {
console.log(sysinfo);
let height = sysinfo.windowHeight;
this.setData({
mapHeight: height
})
},
})
this.getLocationMethod();
},
/**
* 獲取當(dāng)前位置信息
*/
getLocationMethod: function () {
var that = this;
wx.getLocation({
type: 'gcj02',
success: function (res) {
var lat = res.latitude;
var lon = res.longitude;
var selfMarker = {
iconPath: "../../image/current-location.png",
id: 0,
latitude: res.latitude,
longitude: res.longitude,
width: 30,
height: 30,
title: ' 我的當(dāng)前位置 '
}
var tempList = [];
for (var i = 0; i < that.data.markersDefault.length; i++) {
tempList.push(that.data.markersDefault[i]);
}
tempList.push(selfMarker);
that.setData({
mapScale: '14',
location: {
longitude: res.longitude,
latitude: res.latitude
},
markers: tempList
})
//在獲取當(dāng)前位置信息之后赦邻，請(qǐng)求獲取周圍aed信息的接口髓棋，獲取信息
// that.getStoreInfo(res);
},
fail: function (res) {
if (res.errMsg == 'getLocation:fail auth deny') {
wx.showModal({
title: '',
content: '需要授權(quán)定位才能使用此功能',
success: function (res) {
if (res.confirm) {
wx.openSetting({
success: (res) => {
if (res.authSetting['scope.userLocation']) {
that.getLocationMethod();
}
}
})
}
}
})
}
},
complete: function (res) {},
})
},
makertap: function (e) {
var that = this;
var id = e.markerId;
if (id == 0){
that.setData({
showChoosedStoreInfo: false,
choosedStore : {}
})
}
for (var i = 0; i < that.data.markersDefault.length; i++) {
if(that.data.markersDefault[i].id == id){
that.setData({
showChoosedStoreInfo: true,
choosedStore : that.data.markersDefault[i]
})
}
}
},
goThere: function () {
wx.openLocation({
latitude: parseFloat(this.data.choosedStore.latitude),
longitude: parseFloat(this.data.choosedStore.longitude),
name: this.data.choosedStore.title,
scale: 28
})
},
/**
* 回到當(dāng)前位置
*/
setUserLocation: function () {
console.log("回到當(dāng)前位置");
var mapCtx = wx.createMapContext('map')
mapCtx.moveToLocation() //地圖回到當(dāng)前位置
},
/**
* 生命周期函數(shù)--監(jiān)聽頁(yè)面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函數(shù)--監(jiān)聽頁(yè)面顯示
*/
onShow() {
},
/**
* 生命周期函數(shù)--監(jiān)聽頁(yè)面隱藏
*/
onHide() {
},
/**
* 生命周期函數(shù)--監(jiān)聽頁(yè)面卸載
*/
onUnload() {
},
/**
* 頁(yè)面相關(guān)事件處理函數(shù)--監(jiān)聽用戶下拉動(dòng)作
*/
onPullDownRefresh() {
},
/**
* 頁(yè)面上拉觸底事件的處理函數(shù)
*/
onReachBottom() {
},
/**
* 用戶點(diǎn)擊右上角分享
*/
onShareAppMessage() {
}
})
storeMap.json
{
"usingComponents": {},
"navigationBarTitleText": "門店地圖"
}
storeMap.wxss
/* pages/storeMap/storeMap.wxss */
.main {
width: 100%;
}
.map {
width: 100%;
position: absolute;
}
.map-cover {
width: 120rpx;
height: 160rpx;
border-radius: 5rpx;
position: absolute;
bottom: 300rpx;
right: 40rpx;
}
.map-cover-img {
width: 120rpx;
height: 120rpx;
border-radius: 20rpx;
overflow: hidden;
margin: 20rpx 0;
}
.map-cover-5 {
width: 80%;
height: 200rpx;
border-radius: 20rpx;
position: absolute;
bottom: 0rpx;
margin: 0 auto;
background: white;
margin: 10%;
}
.choosed-store-info-img {
width: 200rpx;
height: 160rpx;
float: left;
margin-left: 20rpx;
margin-top: 20rpx;
border-radius: 10rpx;
overflow: hidden;
}
.choosed-store-info-icon {
width: 40rpx;
height: 40rpx;
margin-top: 20rpx;
margin-left: 240rpx;
}
.choosed-store-info-detail {
height: 60rpx;
color: #666666;
font-size: 32rpx;
overflow: hidden;
text-overflow: ellipsis;
word-break: keep-all;
margin-top: -40rpx;
margin-left: 300rpx;
margin-right: 10rpx;
word-break: break-all;
word-wrap: break-word;
white-space: pre-line;
}
.choosed-store-info-button {
height: 60rpx;
width: 240rpx;
font-size: 32rpx;
overflow: hidden;
line-height: 60rpx;
text-align: center;
color: #ffffff;
border-radius: 10rpx;
text-overflow: ellipsis;
word-break: keep-all;
margin-top: 20rpx;
margin-left: 300rpx;
margin-right: 10rpx;
word-break: break-all;
word-wrap: break-word;
white-space: pre-line;
background: #FF9525;
}
上面用到的icon比較簡(jiǎn)單，大家自行尋找替換即可惶洲。沒其他多余的代碼按声，只需要提供一個(gè)入口，跳轉(zhuǎn)到storeMap頁(yè)面即可恬吕，入口UI大家自行設(shè)計(jì)
storeMap() {
wx.navigateTo({
url: '../storeMap/storeMap',
})
},
完成以上签则，編譯后截圖，拿著截圖去申請(qǐng)"打開地圖選擇位置"和"獲取當(dāng)前的地理位置铐料、速度"權(quán)限渐裂，分分鐘通過。親測(cè)有效钠惩，3分鐘審核通過柒凉！通過后，干掉以上代碼即可
