1、初始化好谷歌地图后，再创建一个infowindow对象，下面是自己封装的方法
this.infowindow = this.map.createInfoWindow({ pixelOffset: new google.maps.Size(-30, -40) })// 水平偏移量为0，垂直偏移量为-50

2、然后创建好maker后，监听点击事件，谷歌地图的maker标记没有对应的字段存放的，可以通过原型绑定，以下方法的创建对象，都是自定义封装，只需看对应方式

  let obj = {}obj.lat = v.addressLatobj.lng = v.addressLnglet makerobj = { pos: { lat: obj.lat, lng: obj.lng }}let marker = this.map.addMaker(makerobj)marker.makerInfo = obj //通过绑定变量后，再点击事件里面 通过this指向拿到maker对象的绑定变量marker.addListener('click', function (event) {that.handleClickMaker(marker, this.makerInfo)});

3、infowindow弹窗的设置，踩坑多次，不懂其他的以下是验证的关键，自己测试，只有html字符串才能实现，不懂在vue遇到什么坑

  // marker点击事件async handleClickMaker (marker, info) {this.infoObj = { ...info }let url = this.infoObj.pictureUrllet picUrl = this.pictureUrl;if (url) {picUrl = await getPicUrl({picUrl: url,});}this.infoDom = ` <div style=" height: max-content; width: 250px;background-color: #fff;box-sizing: border-box;padding:10px 20px;"><div style=" display: flex; align-items: center; width: 100%; height: 20px; font-size: 12px;"><span style="font-size: 12px;"><span style=" margin-right: 5px;">地点位置：</span>${this.infoObj.areaName}【${this.infoObj.status == 1 ? "启用" : "停用"}】</span></div><div  style=" display: flex; align-items: center; width: 100%; height: 20px; font-size: 12px;"><span style="font-size: 12px;"><span style=" margin-right: 5px;">站点属性：</span>${this.getProperty(this.infoObj.property)}</span></div><div style=" font-size: 12px;">站点图片：</div><div style="width: 100%; height: 100px;"><img style=" width: 100%; height: 100%;" src="${picUrl}" alt=""></div></div>`this.infowindow.setPosition(marker.getPosition()); //设置弹窗位置this.infowindow.setContent(this.infoDom); // 赋值html// 如果当前 infowindow 是显示状态，则隐藏它if (this.infowindow.getMap()) {this.infowindow.close();}// 显示新的 infowindow，关键的一句this.infowindow.open(this.map.gmap);this.map.gmap.panTo(marker.getPosition()); //移动视图中心位置},