高德地图信息窗体设置

1. 添加默认信息窗体

//构建信息窗体中显示的内容 var info = []; info.push( `<div style="height: 36px; line-height: 45px; padding: 0px 20px; white-space:nowrap;">位置：北京</div>` ); info.push( `<div style="height: 36px; line-height: 20px; padding: 0px 20px; white-space:nowrap;"> 联系人：袁磊 </div>` ); this.infoWindow = new AMap.InfoWindow({ content: info.join("") //使用默认信息窗体框样式，显示信息内容 }); // // getCenter() 获取地图中心点（数组） // this.infoWindow.open(this.aMap, this.aMap.getCenter()); // 设置点坐标为窗体坐标；例：[123.40340954550922, 41.7334550336356] this.infoWindow.open(this.aMap, e.data.lnglat);

2. 使用自定义窗体（添加窗体）

//构建信息窗体中显示的内容 var info = []; info.push( `<div style="height: 36px; line-height: 45px; padding: 0px 20px; white-space:nowrap;">位置：北京</div>` ); info.push( `<div style="height: 36px; line-height: 20px; padding: 0px 20px; white-space:nowrap;"> 联系人：袁磊 </div>` ); that.infoWindow = new AMap.InfoWindow({ isCustom: true, //使用自定义窗体 content: ` <div style="background: #f00;">jdfghjdfihg</div> <div class="close-btn" style="float: right;margin-top: 3px; margin-right: 5px;" onclick="closeInfoWindow()">X</div> `, offset: new AMap.Pixel(16, -45) }); // // getCenter() 获取地图中心点（数组） // this.infoWindow.open(this.aMap, this.aMap.getCenter()); // 设置点坐标为窗体坐标；例：[123.40340954550922, 41.7334550336356] that.infoWindow.open(that.aMap, e.data.lnglat);

3关闭自定义窗体（closeInfoWindow方法也要挂在window）

mounted() { window.closeInfoWindow = () => { this.aMap.clearInfoWindow(); }; },