微信小程序map组件拖拽地图获取经纬度,地址,带定位点范围(中心点固定)
生活随笔
收集整理的這篇文章主要介紹了
微信小程序map组件拖拽地图获取经纬度,地址,带定位点范围(中心点固定)
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
微信小程序map組件之移動(dòng)map選取位置,效果圖如下:
微信小程序map組件,實(shí)現(xiàn)拖拽定位,獲取定位位置,點(diǎn)擊cover-image回到定位原點(diǎn)
手機(jī)效果相同。
廢話不多說(shuō),上代碼
wxml代碼:
<view class="container"><map id="map4select" longitude="{{longitude}}" latitude="{{latitude}}" scale="14" controls="{{controls}}" markers="{{markers}}" show-location bindcontroltap="controltap" polyline="{{polyline}}" bindmarkertap="markertap" circles="{{circles}}" bindregionchange="regionchange" ><cover-image class="cover-image" bindtap="my_location" src="/imgs/my_location.png" /><cover-image class="cover-image_confirm" bindtap="confirm_bag" src="/imgs/confirm.png" /></map></view> regionchange(e) {console.log(e)// 地圖發(fā)生變化的時(shí)候,獲取中間點(diǎn),也就是用戶選擇的位置toFixedif (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)that.setData({latitude: res.latitude,longitude: res.longitude,circles: [{latitude: res.latitude,longitude: res.longitude,color: '#FF0000DD',fillColor: '#d1edff88',radius: 3000,//定位點(diǎn)半徑strokeWidth: 1}]})}})}},//定位到自己的位置事件my_location: function(e) {var that = this;that.onLoad();},可實(shí)現(xiàn)拖拽地圖獲取定位點(diǎn)的經(jīng)度緯度以及地理位置等操作
詳細(xì)代碼QQ:961052877
總結(jié)
以上是生活随笔為你收集整理的微信小程序map组件拖拽地图获取经纬度,地址,带定位点范围(中心点固定)的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: markdown模板(个人使用)
- 下一篇: VAR模型