百度地图 bm-marker和bm-info-window实现打点和点击弹窗功能

效果图
实现代码

<baidu-map class="bm-view" center="北京" :zoom="15" :scroll-wheel-zoom="true">	  
	    <bm-marker v-for="make in markers" :position="{lng: make.lng, lat: make.lat}" :dragging="true" animation="BMAP_ANIMATION_BOUNCE" @click="lookDetail(make)" :icon="{url: require('../assets/logo.png'), size: {width: 50, height: 50}}">
	       <bm-info-window :title="information.name" :position="{lng: information.lng, lat: information.lat}"   :show="make.showFlag" @close="infoWindowClose(make)" @open="infoWindowOpen(make)">
			   经度: {{information.lng}}
			   维度:{{information.lat}}
	       	</bm-info-window>
			  <bm-label
			   content="我爱北京天安门" :labelStyle="{color: 'red', fontSize : '24px'}" :offset="{width: -55, height: 30}"
			  />			
	       </bm-marker>
  </baidu-map>	  

js
export default {
data () {
return {
markers: [
{
lng: 116.404,
lat: 39.915,
showFlag:false
},
{
lng:112.880023,
lat:28.92776,
showFlag:false
}
],

  show: false,
  information:{},
  
}

},
methods: {
lookDetail(make){
make.showFlag = true;
this.information = make;
},

infoWindowClose (make) {
 make.showFlag = false
},
infoWindowOpen (make) {
   make.showFlag  = true
}

}
}

css

注意 应用自己的定义的图片，要用require(自己图片的路径)
eg:url: require(‘…/assets/logo.png’)