0

我正在尝试让markerclusterer 处理我从SQL 数据库中取出的一些数据。它目前正在显示地图，但不显示图钉。如果我console.log使用标记 var，我最终会得到一大堆由索引组织的对象的行，其中 VI 作为值。

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
      html { height: 100% }
      body { height: 100%; margin: 0; padding: 0 }
      #map-canvas { height: 100% }
    </style>
    <script src="jqueryui/js/jquery-1.9.0.js" type="text/javascript"></script>
    <script type="text/javascript"
      src="http://maps.google.com/maps/api/js?key=AIzaSyC3HDl1QHs4Gq_hEW-K60bentHuZlT5_8s&sensor=false">
    </script>

        <script type="text/javascript">
      var script = '<script type="text/javascript" src="markerclusterer';
      if (document.location.search.indexOf('compiled') !== -1) {
        script += '_compiled';
      }
      script += '.js"><' + '/script>';
      document.write(script);
    </script>
    <script type="text/javascript">

          var markers = [];
    $.getJSON('getLatLon.php',{ajax:'false'},function(jsonData){
        $(jsonData).each(function(){
          var latLng = new google.maps.LatLng(this.lat,this.lon);
          var marker = new google.maps.Marker({'position': latLng});
          markers.push(marker);
        });
    });  

      function initialize() {
        var mapOptions = {
          center: new google.maps.LatLng(41.611143, -86.722719),
          zoom: 4,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("map-canvas"),
            mapOptions);



var markerCluster = new MarkerClusterer(map, markers);
}

      google.maps.event.addDomListener(window, 'load', initialize);


    </script>
  </head>
  <body>
    <div id="map-canvas"/>
  </body>
</html>

getLatLon 返回这个，虽然有更多的行。

        [
        {
            "zip": "H8R 3W4",
            "lat": -73.65,
            "lon": 45.43
        },
        {
            "zip": "H8R 3W4",
            "lat": -73.65,
            "lon": 45.43
        }
            ]
4

1 回答 1

1

在 AJAX 回调中加载标记后，您需要将标记放入 MarkerClusterer。

$.getJSON('getLatLon.php',{ajax:'false'},function(jsonData){
    $(jsonData).each(function(){
      var latLng = new google.maps.LatLng(this.lat,this.lon);
      var marker = new google.maps.Marker({'position': latLng});
      markers.push(marker);
    });
    var markerCluster = new MarkerClusterer(map, markers);
});

您可能希望他 markerClusterer 在全局（或至少更大）范围内，但这至少应该显示标记。

于 2013-08-23T17:18:35.217 回答