Question

我目前有一个带有自定义图标的谷歌地图，但出于某种原因，我无法添加信息框。只是寻求一点帮助。这是我现在的代码。我取出了信息框部分，因为它不起作用。

谢谢，富

<html>
  <head>
    <title>Custom Markers</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <style>
      /* Always set the map height explicitly to define the size of the div
       * element that contains the map. */
      #map {
        height: 100%;
      }
      /* Optional: Makes the sample page fill the window. */
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>
    <script>
      var map;
      function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          zoom: 12,
          center: new google.maps.LatLng(41.929988, -87.689522),
          mapTypeId: 'roadmap'
        });

        var iconBase = 'http://www.drinkhoppop.com/shapes/';
        var icons = {
          parking: {
            icon: iconBase + 'map-icons_03.png'
          },
          library: {
            icon: iconBase + 'library_maps.png'
          },
          info: {
            icon: iconBase + 'map-icons_02.png'
          }
        };

        function addMarker(feature) {
          var marker = new google.maps.Marker({
            position: feature.position,
            icon: icons[feature.type].icon,
            map: map
          });
          
        }

        var features = [
          {
            position: new google.maps.LatLng(41.9377782, -87.6920254),
            type: 'info'
          },  {
            position: new google.maps.LatLng(41.939257, -87.7034444),
            type: 'parking'
          }, {
            position: new google.maps.LatLng(41.9005396, -87.6866856),
            type: 'parking'
          }, {
            position: new google.maps.LatLng(41.9245798, -87.7061169),
            type: 'parking'
          }, 
        ];



        

        for (var i = 0, feature; feature = features[i]; i++) {
          addMarker(feature);
        }
      }
    </script>
    <script async defer
    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCAlTwCIpmiVMHzwCLCrOEag__VGHvMfM0&callback=initMap">
    </script>
  </body>
</html>

如何在Google地图中为多个自定义标记创建信息窗口？

0 个答案: