微信小程序 地图(map)实例详解

网友投稿 406 2023-06-29


微信小程序 地图(map)实例详解

微信小程序 地图(map)实例

这里是对微信小程序 地图(map API )做的资料整理,获取当前的地址,应该如何实现的实例,大家可以看下。

今天做到地图定位的模块.模拟器肯定是获取不到位置的.下面为真机测试结果.

上图:

经纬度不说了.定位用的,我这里直接输入的数字定位.但是有许多问题

下图中scale是缩放比例,这个属性目前无效.后期微信团队应该会修复.毕竟现在刚开始公测.这样就导致我不管怎么修改scale,我的地图都是在默认的缩放比例.如上图.

markers中的rotate是图标的旋转角度.如果需要平行于屏幕的图标,那就设置为0吧.

另外,覆盖物的图标是可以修改的.给iconPath设置路径即可.

上一段代码:

//index.js

//获取应用实例

var app = getApp()

Page({

data: {

latitude: 0,//纬度

longitude: 0,//经度

speed: 0,//速度

accuracy: 16,//位置精准度

markers: [],

covers: [],

},

onLoad: function () {

},

getlocation: function () {

var markers = [{

latitude: 31.23,

longitude: 121.47,

name: '浦东新区',

desc: '我的位置'

}]

var covers = [{

latitude: 31.23,

longitude: 121.47,

iconPath: '../images/car.png',

rotate: 0

}]

this.setData({

longitude: 121.47,

latitude: 31.23,

markers: markers,

covers: covers,

})

}

})

2.wx.getLocation(OBJECT) 获取当前位置API

红色框标出的就是经纬度,速度,精确度

用gch02返回的坐标可以直接打开地图.

3.wx.openLocation(OBJECT) 查看位置

最简单粗暴的就是直接给经纬度定位.

代码:

/index.js http://

//获取应用实例

var app = getApp()

Page({

data: {

latitude: 0,//纬度

longitude: 0,//经度

speed: 0,//速度

accuracy: 16,//位置精准度

markers: [],

covers: [],

},

onLoad: function () {

},

getlocation: function () {

wx.getLocation({

type: 'gcj02',

success: function (res) {

var latitude = res.latitude

var longitude = res.longitude

var speed = res.speed

var accuracy = res.accuracy

console.log("latitude:" + latitude)

console.log("longitude:" + longitude)

console.log("speed:" + speed)

console.log("accuracy:" + accuracy)

wx.openLocation({

latitude: latitude,

longitude: longitude,

scale: 28

})

}

})

}

})

真机测试 效果图:

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!


版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。

上一篇:微信小程序 获取相册照片实例详解
下一篇:Java实现调用MySQL存储过程详解
相关文章

 发表评论

暂时没有评论,来抢沙发吧~