微信小程序开发之map地图实现教程
前言微信小程序地图操作比较简单,api也很少,使用map组件来展示。说到地图,那就先来看基础定位: 定位用到 定位成功会返回四个参数值,如下: map属性太多,先看一下: 如果用到地图,基本上所有属性都会用到。 下面一一看一下,我们先看效果图吧,先看真相: 这里我只用了一个markers,就是定位当前位置的红色markers,用法如下: _this.setData({
latitude: res.latitude,longitude: res.longitude,markers: [{ id: "1",latitude: res.latitude,width: 50,height: 50,iconPath: "/assests/imgs/my.png",title: "哪里" }],circles: [{ }) }) 这里加了circles,半径是3000米,具体的api可自行看。 接下来看看controls,控制层,在地图上显示控件,控件不随着地图移动,看API: 注意看示例图的右上角,有两个按钮,加减号,是控制地图scale的数值变化,动态缩放地图的,controls用法也很简单: 最后我们看一张gif图: 最后上一下具体代码:wxml:js:},onLoad: function () {
var _this = this; wx.getSystemInfo({ }) } wx.getLocation({ }) }) },regionchange(e) { wx.showActionSheet({ },}) 总结以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对编程之家的支持。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |