Question

我尝试在我的gmap中粘贴群集解决方案。但是对于每个标记都形成了簇，而不是针对所有地图。我认为“var markerCluster”需要在“function addMarker”之外删除，但怎么做呢？ Screenshot

<script type="text/javascript">
 var icon = new google.maps.MarkerImage("images/home.png",
 new google.maps.Size(32, 32), new google.maps.Point(0, 0),
 new google.maps.Point(16, 32));
 var center = null;
 var map = null;
 var currentPopup;
 var bounds = new google.maps.LatLngBounds();
 var markerArray = [];

 function addMarker(lat, lng, info) {

     var markerArray = [];      
     for (var i = 0; i < 10; i++) {
     var pt = new google.maps.LatLng(lat, lng);
     bounds.extend(pt);
     var marker = new google.maps.Marker({
     position: pt,
     icon: icon,
     map: map
     });
     markerArray.push(marker);
    }
     var markerCluster = new MarkerClusterer(map, markerArray);

     var popup = new google.maps.InfoWindow({
     content: info,
     maxWidth: 500,
     maxHeight: 500,
     });
     google.maps.event.addListener(marker, "click", function() {
     if (currentPopup != null) {
     currentPopup.close();
     currentPopup = null;
     }
     popup.open(map, marker);
     currentPopup = popup;
     });
     google.maps.event.addListener(popup, "closeclick", function() {
     //map.panTo(center);
     currentPopup = null;
     });
    }



 function initMap() {
 map = new google.maps.Map(document.getElementById("map"), {
 center: new google.maps.LatLng(0, 0),
 zoom: 10,
 mapTypeId: google.maps.MapTypeId.ROADMAP,
 mapTypeControl: false,
 mapTypeControlOptions: {
 style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR
 },
 navigationControl: true,
 navigationControlOptions: {
 style: google.maps.NavigationControlStyle.SMALL
 }

 });


 <?php

$query = mysql_query("SELECT * FROM table WHERE lat !=0 && lng !=0 GROUP BY lat");
while ($row = mysql_fetch_array($query)){

$city=end(explode(',', $str_from));


echo ("addMarker($lat, $lon,'<div style=\"width:130px\"><b>$city</b></div>");
echo ("');\n");

 }
?>

 center = bounds.getCenter();
 map.fitBounds(bounds);

 }

 </script>


 <div id="map"></div>
 <body onload = "initMap();"></body>

Answer 1

就像这样，只有在完成调用addMarker（）的所有查询结果的循环后才更新markerCluster：

 var icon = new google.maps.MarkerImage("images/home.png",
     new google.maps.Size(32, 32), new google.maps.Point(0, 0),
     new google.maps.Point(16, 32));
 var center = null;
 var map = null;
 var currentPopup;
 var bounds = new google.maps.LatLngBounds();
 var markerArray = [];
 var markerCluster;

 function addMarker(lat, lng, info) {
     for (var i = 0; i < 10; i++) {
         var pt = new google.maps.LatLng(lat, lng);
         bounds.extend(pt);
         var marker = new google.maps.Marker({
             position: pt,
             icon: icon,
             map: map
         });
         markerArray.push(marker);
     }

     var popup = new google.maps.InfoWindow({
         content: info,
         maxWidth: 500,
         maxHeight: 500,
     });
     google.maps.event.addListener(marker, "click", function () {
         if (currentPopup != null) {
             currentPopup.close();
             currentPopup = null;
         }
         popup.open(map, marker);
         currentPopup = popup;
     });
     google.maps.event.addListener(popup, "closeclick", function () {
         //map.panTo(center);
         currentPopup = null;
     });
 }



 function initMap() {
     map = new google.maps.Map(document.getElementById("map"), {
         center: new google.maps.LatLng(0, 0),
         zoom: 10,
         mapTypeId: google.maps.MapTypeId.ROADMAP,
         mapTypeControl: false,
         mapTypeControlOptions: {
             style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR
         },
         navigationControl: true,
         navigationControlOptions: {
             style: google.maps.NavigationControlStyle.SMALL
         }

     });


     <? php

     $query = mysql_query("SELECT * FROM table WHERE lat !=0 && lng !=0 GROUP BY lat");
     while ($row = mysql_fetch_array($query)) {

         $city = end(explode(',', $str_from));


         echo("addMarker($lat, $lon,'<div style=\"width:130px\"><b>$city</b></div>");
         echo("');\n");

     } ?>

     markerCluster = new MarkerClusterer(map, markerArray);

     center = bounds.getCenter();
     map.fitBounds(bounds);

 }

Google地图群集是针对不是所有地图的每个标记而形成的

1 个答案: