map
标签
使用
map
标签可以看到地图,然后在index.wxss里设置样式。wxss里面默认有一个page属性
page{
height: 100%;
}
map{
width:100%;
height: 100%;
}
这时候可以看到一个充满屏幕的地图,可以根据鼠标选择位置
但是每次编译位置都是北京的位置
位置定位
使用GPS定位到当前位置
在map标签里面添加一个属性,表示经度、纬度,longitude,经度,latitude,纬度
用腾讯坐标拾取器查取一个位置的经纬度,我查取得是银川汽车站,
<map
longitude='106.292590'
latitude='38.468760'
></map>
这是可以看到地图中显示的是银川汽车站
因为后期经纬度是根据手机的GSP位置来进行定位的,所以在index.js的data里面定义两个属性
而在index.wxml中获取这两个属性的值
<map
longitude='{{longitude}}'
latitude='{{latitude}}'
></map>
根据智能设备动态获取地理位置
打开模拟器的调试器,里面有个Sensor,里面会有相应的经纬度信息。
index.js里面的onload是首次加载页面的时候会被调用,可以在这里设置一些初始化的信息。
首先data里面的经纬度的初始值都会被设置为0;
data: {
longitude: 0,
latitude: 0
},
sensor里面的经纬度值
在onload里面获取经纬度值
onLoad: function () {
var that=this;
wx.getLocation({
success: function(res) {
var logi=res.longitude;
var lat=res.latitude;
that.setData({
longitude:logi,
latitude:lat
})
},
})
}
wx.getLocation是根据智能设备获取当前的位置信息
setData是给data中的属性设置值。