在我写的微信小程序项目中有这样需求,当地图缩小时不显示其中的文字,当地图放大到一定程度时显示自定义气泡文字。
于是我查看官方文档,有这样一条属性
可以根据地图视野发生变化来判断是否显示自定义气泡文字。
当初始加载时不显示文字
let giftlist = {
id:2,
iconPath: 'https://img1.baidu.com/it/u=937079860,934368143&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
latitude: 39.989643,
longitude: 116.481028,
width: 32,
height: 32,
// stationName:'蜜雪冰城',
// customCallout:{
// anchrY:0,
// anchrX:0,
// display:'ALWAYS'
// }
}
当视野发生变化时,判断视野的范围(根据自己业务需求)来进行添加文字
regionchange(e){
let t = this
// console.log(e);
if(e.type=='end'){
if(e.detail.scale >16.5){
// console.log('111111111111');
Pageshome.getPlatRegionPositionList().then(res=>{
let data = res.data
// console.log(data);
let liwulist = []
data.forEach((item,index)=>{
let giftlist = {
id:2,
iconPath: 'https://img1.baidu.com/it/u=937079860,934368143&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
latitude: 39.989643,
longitude: 116.481028,
width: 32,
height: 32,
stationName:'蜜雪冰城',
customCallout:{
anchrY:30,
anchrX:0,
display:'ALWAYS'
}
}
// console.log(item);
giftlist.iconPath = item.position_type_image
giftlist.latitude = item.position_latitude
giftlist.longitude = item.position_longitude
giftlist.stationName = item.position_name
giftlist.width = 32
giftlist.height = 24
giftlist.id = item.position_id
liwulist.push(giftlist)
// console.log(liwulist);
})
t.$nextTick(()=>{
t.marker = liwulist
})
// console.log(this.marker);
})
}else{
this.getmappointList()
}
}
}
这样就能实现根据地图缩放等级来是否显示自定义气泡文字。