1、搜索并打开微信小程序“地图标记制作”;
2、点击地图右侧的加号按钮,就可以进入选择地点的页面,可以拖动地图选择位置,也可以点击上面的搜索框选择位置;
3、选中地点之后,可以自定义标记的名称、标签、颜色等信息。
根据导出的GPX文件,在地图上绘制其路径轨迹。
GPX: the GPS Exchange Format
GPX (GPS交换格式)是一种轻量级XML数据格式,用于在互联网上的应用程序和Web服务之间交换GPS数据(路径、路由和跟踪)。
在线XML转JSON - BeJSON
为了方便后续绑定使用,转换后批量将“lat”替换为“latitude”、“lon”替换为“longitude”。
将转换后的JSON文件部署到本地服务器,先进行本地测试。
通过 wx.request 获取数据: 微信小程序通过api接口将json数据展现到小程序示例
使用本地链接进行测试会报错,需要将项目设置里勾选上“不校验...”: 【微信小程序】 微信小程序连接本地接口
本地测试没问题后,将文件部署到外网环境,改下url就可以了。
由于数据格式已经与小程序要求的一致了,直接将其赋给对应的Key即可。
需要注意的是,在 wx.request 回调里直接使用 this.setData 会报错: 微信小程序中this指向作用域问题this.setData is not a function报错 。
至此,已基本满足预研需求,后续开发具体功能时会方便不少啦 ~ O(∩_∩)O ~
如果能够显示 卫星地图 就完美了,不过还没找到好的解决方案,留作另一个问题吧,TX不开放也没办法了。
微信小程序如何设置地图导航
登入到速成应用平台账号,进入到“小程序模板”页面,选择“新建空白小程序”或选中某个模板后点击“使用”,随后设置下项目封面和标题,进入到小程序编辑页面;可以使用文本、图片等组件,将选中的组件(如文本)点击/拖拽到右边“编辑框页面中”,如下截图
二 、如何设置地图导航
点击放置在模板中的组件(如文本)然后右侧面板点击“事件-功能-调用功能-地图导航”进行设置。
三 、如何绑定位置信息
右侧面板设置好地图导航,点击“地图管理-功能数据管理-地图管理”添加地址,填写公司名称、位置信息,保存;返回编辑页面并点击保存,然后刷新页面,选择文本并点击“事件-功能-绑定地址”,会出现我们刚设置好的“公司名称”,选中他即绑定成功。说明:可显示路线并调用手机上“地图app”。
好了,今天的学习就到了,小姐姐希望阔爱的你可以鼓起勇气,用上地图导航,让它引导你走到心上那个人儿所在的地方。恋人也罢,朋友、亲人也罢,相信你将不虚此行~
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)