微信小程序绘制地图轨迹线路

绘制轨迹的话需要拿到坐标点，获取到坐标点之后再地图上进行绘制就可以；

布局文件：

<map class="mapUI" id="myMap" markers="{{markers}}" latitude="{{latitude}}" longitude="{{longitude}}" polyline="{{polyline}}" include-points='{{points}}' covers="{{covers}}" scale="13"></map>

js文件：

在实现轨迹绘制的时候需要的数据

1：起点的坐标数据和icon

2：终点的坐标数据和icon

3：绘制线路的坐标数据集合

实现代码：

  thatInfor.setData({markers: [{latitude: startEnd.Lat,longitude: startEnd.Lon,id: 20,iconPath: '../../image/mocar.png',width: '40px',height: '60px',anchor: {x: 0.5,y: 0.4}}, {id: 1,latitude: startEnd.Lat,longitude: startEnd.Lon,name: "起点",iconPath: '../../image/icon_start.png',content: "111",width: '25px',height: '40px',},{id: 2,latitude: endModel.Lat,longitude: endModel.Lon,name: "终点",iconPath: '../../image/icon_end.png',width: '25px',height: '40px',}],polyline: [{points: pointinfor,color: '#40ac44',width: 5,dottedLine: false,arrowLine: true,borderWidth: 2,}],})//地图绘制var mapCtx = wx.createMapContext("myMap");mapCtx.includePoints({points: pointinfor})

微信小程序绘制地图轨迹线路相关推荐

微信小程序map地图轨迹回放的问题
map地图轨迹回放报FaceTo的错误如果你的轨迹回放报出这个错误,那么你可能和我一样,是在轨迹回放还未结束的时候或者说是还没有到一个点停止的时候就更新了新的位置信息,想让地图重新的渲染并执行. 这 ...
微信小程序调用地图和跟据经纬度打开手机地图导航
微信小程序调用地图和跟据经纬度打开手机地图导航第一步:输入地址位置 wxml<button bindtap="onChooseLocation">打开地图</b ...
微信小程序绘制分享图
微信小程序绘制分享图例子: demo下载地址:https://gitee.com/v-Xie/wxCanvasShar 大致代码会再以下说明实际开发项目: 基础知识点: 了解canvas基础知识 w ...
高德地图api调用demo_微信小程序----高德地图API实现的DEMO
[实例简介] 微信小程序----高德地图API实现的周边,天气,路线规划,地址详情等的DEMO.简单的效果,问一下官方能不能不要乱涨积分,你们涨积分,作者被骂!我真的很失望,再这样,我就不上传资源了! ...
微信小程序百度地图API移动选点
微信小程序百度地图API移动选点本文首发微信小程序百度地图API移动选点因为业务需要使用百度地图API,参考一位大佬编写腾讯API的思路和方法,改造成百度地图API移动选点. 思路: wxml前端 ...
微信小程序绘制海报，或者把多张图片合成一张
微信小程序绘制海报,或者把多张图片合成一张,例子 <image style='height:{{mabgh}}px;width:{{mabgw}}px;' class="savepng ...
uniapp微信小程序 map地图markers图标不显示，markers图标真机调试不显示
uniapp微信小程序 map地图markers图标不显示,markers图标真机调试不显示举例: 预期效果如下,蓝色为用户位置,红色为店铺位置均为自定义图标实际发布后手机上的效果 (此处忽略位置 ...
腾讯位置服务--微信小程序JSSDK地图开发
腾讯位置服务–微信小程序JSSDK地图开发 1.腾讯位置服务文档传送门:https://lbs.qq.com/miniProgram/jsSdk/jsSdkGuide/jsSdkOverview [ ...
微信小程序-3D地图场景+定位导航-法院3D室内导航系统-为群众提供诉讼全流程导航服务
随着互联网信息的快速发展,我国的信息化水平也得到了全面的提升.尤其近几年在疫情的影响下,微信的小程序应用已经渗入生活的方方面面,无论是日常出行的健康码还是线上商城的购物,小程序以其轻便.响应速度快.不 ...

微信小程序绘制地图轨迹线路

微信小程序绘制地图轨迹线路相关推荐

最新文章

热门文章