HTML google地图添加自定义div作为标记

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>

<div id="map" style="width: 100%; height: 400px;"></div>

<script>
  function initMap() {
    var mapOptions = {
      center: { lat: 37.7749, lng: -122.4194 }, // 设置地图中心位置的经纬度
      zoom: 12 // 设置地图缩放级别
    };
    var map = new google.maps.Map(document.getElementById("map"), mapOptions);

    var markerOptions = {
      position: { lat: 37.7749, lng: -122.4194 }, // 设置标记的经纬度
      map: map,
      icon: "path/to/custom-marker.png" // 设置自定义标记的图标
    };
    var marker = new google.maps.Marker(markerOptions);

    var infoWindowOptions = {
      content: "<div>自定义标记的内容</div>" // 设置自定义标记的内容
    };
    var infoWindow = new google.maps.InfoWindow(infoWindowOptions);
    marker.addListener("click", function() {
      infoWindow.open(map, marker);
    });
  }
</script>

<script>
  initMap();
</script>