You can not select more than 25 topics
			Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
		
		
		
		
		
			
		
			
				
					
					
						
							113 lines
						
					
					
						
							2.1 KiB
						
					
					
				
			
		
		
	
	
							113 lines
						
					
					
						
							2.1 KiB
						
					
					
				<template> | 
						|
  <view class="page-content"> | 
						|
    <view class="page-section page-section-gap"> | 
						|
      <map | 
						|
        style="width: 100%; height: 1600rpx;" | 
						|
        id="mymap" | 
						|
        show-location | 
						|
        enable-traffic | 
						|
        show-compass | 
						|
        :latitude="latitude" | 
						|
        enable-3D | 
						|
        :longitude="longitude" | 
						|
        :markers="covers" | 
						|
        :polyline="polyline" | 
						|
        @markertap="ontouchMaker" | 
						|
      ></map> | 
						|
    </view> | 
						|
  </view> | 
						|
</template> | 
						|
 | 
						|
<script> | 
						|
export default { | 
						|
  data() { | 
						|
    return { | 
						|
      id: 0, // 使用 marker点击事件 需要填写id | 
						|
      title: 'map', | 
						|
      longitude: 117.166483, | 
						|
      latitude: 31.764309, | 
						|
 | 
						|
      polyline: [{ | 
						|
        points: [{ | 
						|
          latitude: 31.764325, | 
						|
          longitude: 117.16659 | 
						|
        }, { | 
						|
          latitude: 31.764309, | 
						|
          longitude: 117.166482 | 
						|
        }, | 
						|
        { | 
						|
          latitude: 31.764308, | 
						|
          longitude: 117.166483 | 
						|
        }, | 
						|
        { | 
						|
          latitude: 31.764312, | 
						|
          longitude: 117.166488 | 
						|
        }, | 
						|
        { | 
						|
          latitude: 31.764332, | 
						|
          longitude: 117.166583 | 
						|
        } | 
						|
        ], | 
						|
        color: '#0AED4D', | 
						|
        width: 3, | 
						|
        borderWidth: 2, | 
						|
      }], | 
						|
 | 
						|
 | 
						|
      covers: [{ | 
						|
        id: 0, | 
						|
        latitude: 39.909, | 
						|
        longitude: 116.39742, | 
						|
        iconPath: '../../static/img/60.jpg', | 
						|
        width: 36, | 
						|
        height: 36, | 
						|
        alpha: 0.8 | 
						|
      }, { | 
						|
        id: 1, | 
						|
        latitude: 39.90, | 
						|
        longitude: 116.39, | 
						|
        iconPath: '../../static/img/28.png', | 
						|
        width: 36, | 
						|
        alpha: 0.8, | 
						|
        height: 36 | 
						|
      }] | 
						|
    } | 
						|
  }, | 
						|
  onShow() { | 
						|
  	    var mymap = uni.createMapContext('mymap', this) | 
						|
  	    mymap.moveToLocation() | 
						|
  	 | 
						|
  }, | 
						|
  onReady() { | 
						|
    var mymap = uni.createMapContext('mymap', this) | 
						|
    mymap.moveToLocation() | 
						|
 | 
						|
	}, | 
						|
	 | 
						|
  methods: { | 
						|
    ontouchMaker(e) { | 
						|
      console.log(e, e.detail) | 
						|
      console.log(this.covers[e.detail.markerId]) | 
						|
    } | 
						|
 | 
						|
  } | 
						|
} | 
						|
</script> | 
						|
 | 
						|
<style scoped> | 
						|
.page-content { | 
						|
  min-height: 100%; | 
						|
} | 
						|
 | 
						|
.logo { | 
						|
  min-width: 100%; | 
						|
  text-align: center; | 
						|
} | 
						|
 | 
						|
.logo img { | 
						|
  width: 200upx; | 
						|
  height: 200rpx; | 
						|
  background-size: contain; | 
						|
  margin: auto; | 
						|
} | 
						|
</style>
 | 
						|
 |