Question

不幸的是，我是javascript的新手，所以遇到了一个无法用Google搜索的问题。我有一个代码，可以在Google地图上从多个位置创建圆，并在中间创建带有动态文本的标记。这是我的问题：文本仅出现在locations数组的最后一个元素上。

<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <script src="https://maps.googleapis.com/maps/api/js"></script>
    <script src="https://cdn.rawgit.com/googlemaps/v3-utility-library/master/infobox/src/infobox.js"></script>
    <style>

      #map {
        height: 100%;
      }
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
    </style>
  </head>

  <body>



    <div id="map"></div>
    <script>
        var citymap = {
            L1:     {
                center: {lat: 44.827978, lng: 18.196670}
                    },
            L2:     {
                    center: {lat: 44.812317, lng: 18.266185}
                    }, 
            L3:     {
                    center: {lat: 44.812317, lng: 18.366185}
                    }, 
        };

      function initMap() 
      {
        // Create the map.
        var map = new google.maps.Map(document.getElementById('map'), {
          zoom: 12,
          center: {lat: 44.827978, lng: 18.296670},
          mapTypeId: 'terrain'
        });

        for (var city in citymap) 
        {

          var cityCircle = new google.maps.Circle({
            strokeColor: '#FF0000',
            strokeOpacity: 0.3,
            strokeWeight: 2,
            fillColor: '#FF0000',
            fillOpacity: 0.05,
            map: map,
            center: citymap[city].center,
            radius: 4000
          });

         var contentString = '<div id="content">'+
          '<div id="siteNotice">'+
          '</div>'+
          '<h1 id="firstHeading" class="firstHeading"><?php echo "Something";?></h1>'+
          '<div id="bodyContent">'+
          '<p><b><?php echo "Some";?></b><br>' +
          '<?php echo "what";?>'+
          '</div>'+
          '</div>';

          var infowindow = new google.maps.InfoWindow({
            content: contentString,
            position: citymap[city].center
          });

          var marker = new google.maps.Marker({
            position: citymap[city].center,
            map: map
          });

          marker.addListener('click', function() {
            infowindow.open(map, marker);
          });

        }
      }

    </script>
    <script async defer
    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCONb4RzPqTe1SSF9WwbVQ5-XNrYdRauPE&callback=initMap">
    </script>


  </body>
</html>

所有圆圈都可以，但是如果我单击每个标记，则contentString仅出现在最后一个标记处。我想将动态数据打印到每个标记。这就是为什么我将标记变量放在for循环中的原因。你能帮我吗？我哪里出错了？

谢谢！

向标记添加文本

0 个答案: