使自定义叠加层可点击(Google Maps API v3)

function CustomOverlay(position, imgUrl, map) {
  this.position = position;
  this.imgUrl = imgUrl;
  this.map = map;
  this.div = null;
}

CustomOverlay.prototype = new google.maps.OverlayView();

CustomOverlay.prototype.draw = function () {
  var self = this;
  var div = document.createElement('div');
  div.style.borderStyle = 'none';
  div.style.borderWidth = '0px';
  div.style.position = 'absolute';

  var img = new Image();
  img.src = this.imgUrl;
  img.onload = function () {
    div.style.width = img.width + 'px';
    div.style.height = img.height + 'px';
    self.div = div;
    self.setMap(self.map);
    self.update();
  };

  google.maps.event.addDomListener(div, 'click', function () {
    google.maps.event.trigger(self, 'click');
  });
};

CustomOverlay.prototype.onAdd = function () {
  this.getPanes().overlayLayer.appendChild(this.div);
};

CustomOverlay.prototype.onRemove = function () {
  this.div.parentNode.removeChild(this.div);
  this.div = null;
};

CustomOverlay.prototype.update = function () {
  var overlayProjection = this.getProjection();
  var point = overlayProjection.fromLatLngToDivPixel(this.position);
  if (point) {
    this.div.style.left = point.x + 'px';
    this.div.style.top = point.y + 'px';
  }
};

var customOverlay = new CustomOverlay(
  new google.maps.LatLng(40.7128, -74.0060),
  'https://example.com/path/to/your/image.png',
  map
);

google.maps.event.addListener(customOverlay, 'click', function () {
  alert('Custom overlay clicked!');
});