微信小程序地图polygons自己标点，三个点以上连成面

在微信小程序地图中，自己标点，三个点以上连成面，方法里边有注释

wxml

<map id="map" style="width:100%;height:100%;" longitude="{{longitude}}" latitude="{{latitude}}" bindtap="bindMap" polygons="{{polygons}}" markers='{{markers}}'></map>


Page({/*** 页面的初始数据*/data: {longitude: 0,latitude: 0,markers:[],gonsArr:[],polygons: [{points: [],//给个空数组在页面刚开始渲染的时候会报错，但是不影响使用fillColor: "#ffff00",strokeColor: "#00B277",strokeWidth: 2,zIndex: 1}],},//点击地图的时候bindMap(e) {let arr=this.data.gonsArr    //不直接使用polygons[0].points是因为如果不够三个点会报错let arr1=this.data.markers   //点击地图添加一个标记点let latitude=e.detail.latitude   let longitude=e.detail.longitude   arr.push({latitude,longitude})   arr1.push({latitude,longitude,iconPath: "../../image/map.png",id: latitude,width: '63rpx',height: '88rpx'})//判断如果标记的点数大于等于3就给polygons[0].points赋值，如果小于3只添加点并且给gonsArr push一下if(arr.length>2){this.data.polygons[0].points=arrthis.setData({polygons:this.data.polygons,markers:arr1,gonsArr:arr})}else{this.setData({markers:arr1,gonsArr:arr})}},//清除标记点和面clearGon(){let arr=this.data.polygonsarr[0].points=[]this.setData({polygons:arr,markers:[],gonsArr:[]})},submitGon(){console.log(123)},getPosition() {var that = this;//  获取当前定位的经纬度信息wx.showLoading({title: "定位中",mask: true})wx.getLocation({type: 'gcj02',altitude: true, //高精度定位//定位成功，更新定位结果success: function (res) {var latitudee = res.latitudevar longitudee = res.longitudethat.setData({longitude: parseFloat(longitudee),latitude: parseFloat(latitudee),})},//定位失败回调fail: function (res) {},complete: function () {}})},onLoad(options) {this.getPosition()//获取当前经纬度},})

polygons[0].points给空数组会报这个错，暂时没有什么好的解决办法，如果有解决办法，欢迎交流！

微信小程序地图polygons自己标点，三个点以上连成面相关推荐

微信小程序地图组件和相机组件实现基于location的AR效果的尝试（失败）
微信小程序地图组件和相机组件实现基于location的AR效果的尝试(失败) 最近无论AR还是微信小程序都是炒的火热.微信小程序的特点便是"无需安装,用完即走",而我们所说的AR用 ...
微信小程序地图使用用户头像标记
一.在开发微信小程序地图的过程中,有这样一个需求,用户发表祝福语,然后存入数据库,可以在地图上显示用户头像并且点击用户头像时显示祝福语. 二.自己在开发时遇到的问题: 1.微信头像是网络图片,而地图的 ...
php小程序地图处理,微信小程序地图map详解及简单实例
微信小程序地图map 微信小程序map 地图属性名类型默认值说明longitudeNumber中心经度 latitudeNumber中心纬度 scaleNumber1缩放级别 markersArra ...
微信小程序从零开始开发步骤（三）底部导航栏
上一章节,我们分享了如何创建一个新的页面和设置页面的标题,这一章我们来聊聊底部导航栏是如何实现的.即点击底部的导航,会实现不同对应页面之间的切换. 我们先来看个我们要实现的底部导航栏的效果图:(三个导 ...
微信小程序微信小程序地图搜索、地图搜索点点击出callout气泡标题说明
实现效果:根据楼盘名称实现地图定位.周边搜索: 代码: html <view class="mapinfo"><view class="mapbd&qu ...
php小程序地图处理,微信小程序地图 map
微信小程序地图 map 微信小程序map 地图标记点标记点用于在地图上显示标记的位置,不能自定义图标和样式覆盖物覆盖物用于在地图上显示自定义图标,可自定义图标和样式地图组件的经纬度必填, 如 ...
详解微信小程序页面间传递信息的三种方式
详解微信小程序页面间传递信息的三种方式在开发微信小程序的时候,经常会遇到在页面间传递信息的情况,有三种方法可以实现. 1. 使用数据缓存将要存储的数据使用以下方法放入缓存 wx.setStorag ...
微信小程序--地图上添加图片
如何在微信小程序地图添加上,添加图片? 在微信小程序中,地图的层级最高,所以我们没有办法,通过定位,在地图上添加图片等信息; 处理办法: 添加控件:controls; 其中有个属性position,进 ...
微信小程序地图获取地点信息（打卡签到功能为例）-2020-7-26
目录微信小程序地图获取地点信息(打卡签到功能为例) 效果图前提步骤首先需要了解的代码部分配置性代码功能性代码 demo 下载微信小程序地图获取地点信息(打卡签到功能为例) 解决方案:利用 ...
微信小程序---地图导航（点击地址，可以进行导航）
微信小程序-地图导航(点击地址,可以进行导航) // 地图getLocation(e){var that = this,address = e.currentTarget.dataset.addres ...

微信小程序地图polygons自己标点，三个点以上连成面

在微信小程序地图中，自己标点，三个点以上连成面，方法里边有注释

polygons[0].points给空数组会报这个错，暂时没有什么好的解决办法，如果有解决办法，欢迎交流！

微信小程序地图polygons自己标点，三个点以上连成面相关推荐

最新文章

热门文章