小程序 marker calllout 踩坑

 

在 uni-app 里面调用小程序 map ，需求要使用气泡，这里面有两种气泡 ，一种是默认的，一种是自定义的

默认的就是直接在 markers 数组里面添加 title 

自定义的就是 在 markers 里面添加 callout，

这里要注意 color 必须是 十六进制的，必须是六位的！！

气泡必须要点击才会看见！！

官方文档在这里，可以详细看下

callout: {
			content: '我是二号起泡',
			color: "#ff0000",
			fontSize: 16, 
			borderRadius: 10,
			bgColor: "#ffffff",
			padding: 10
		}

 <view class="map">
   <map id="map" :longitude="longitude" :latitude="latitude" scale="18" :polyline="polyline" :markers="markers" show-location style="width: 100%; height: 300px;"></map>
 </view>

markers: [
  {
	id: 0,
	latitude: 33.78098,
	longitude: 119.26089,
	title: '我是一号标点'
  },
  {
	id: 1,
	latitude: 33.779778,
	longitude: 120.701855,
	callout: {
          content: '我是二号起泡',
	  color: "#ff0000",
	  fontSize: 16, 
	  borderRadius: 10,
	  bgColor: "#ffffff",
	  padding: 10
	}
  },
  {
	id: 2,
	latitude: 33.779778,
	longitude: 119.701955
  }
]