微信小程序 地图拖拽，获取地图拖拽的位置

我的大boss今天突发奇想要做一个拖拽地图，需获取所展示地图中心的点位置，因此我搜索的半天的度娘，终于出来了我想要的效果，与大家分享一下。当做一个学习参考。

css样式

.cover-image{

position: absolute;

top:50%;

left:50%;

margin-top:-25rpx;

margin-left:-25rpx;

width:50rpx;

height: 50rpx;

}

.cover-image_confirm{

width:50rpx;

height: 50rpx;

}

.map{

width:950rpx;

height: 1002rpx;

}

wxml

js

//index.js

//获取应用实例

const app = getApp()

 

Page({

data: {

longitude: '108.947040',

latitude: '34.259430',

},

onLoad(){

 

},

regionchange(e) {

console.log(e)

// 地图发生变化的时候，获取中间点，也就是用户选择的位置toFixed

if (e.type == 'end' && (e.causedBy == 'scale' || e.causedBy == 'drag')) {

console.log(e)

var that = this;

this.mapCtx = wx.createMapContext("map4select");

this.mapCtx.getCenterLocation({

type: 'gcj02',

success: function (res) {

console.log(res,11111)

that.setData({

latitude: res.latitude,

longitude: res.longitude,

circles: [{

latitude: res.latitude,

longitude: res.longitude,

color: '#FF0000DD',

fillColor: '#d1edff88',

radius: 3000,//定位点半径

strokeWidth: 1

}]

})

}

})

}

},

//定位到自己的位置事件

my_location: function (e) {

var that = this;

that.onLoad();

},

})

快来试试吧(*^__^*) 嘻嘻