挑战100个功能(一)---地图

80 阅读1分钟

1.先上最常用到的地方,小程序uniapp地图

		<map name="gsh" 
                class="map" 
                id="map" 
                :scale="scale" //缩放大小
                enable-3D="false" 
                show-compass="false"
		enable-overlooking="false" :
                enable-satellite="false" 
                :enable-traffic="false" 
                show-location="false"
		:latitude="latitude" //动态绑定经度
                :longitude="longitude" //动态绑定纬度
                :markers="markers" //固定的位置
                @markertap='markerstap'
                ></map>

直接上图

image.png

然后介绍下事件

1.点击图标

@markertap='markerstap'
markerstap() {
       //拿到经纬度
	uni.getLocation({
	  type: 'gcj02', //返回可以用于uni.openLocation的经纬度
	  success: function(res) {
	    const latitude = res.latitude;
	    const longitude = res.longitude;
	    uni.openLocation({
		latitude: latitude,
		longitude: longitude,
		success: function() {
			console.log('success');
			}
		});
	   }
       });
 },
 
 //注意,可能会遇到报错,需要在源码视图中声明,mainifast.js中
 "mp-weixin": {
		"requiredPrivateInfos": ["getLocation"],
                }
 

2.点击地图事件

@tap="tap