Google Maps v3 API MarkerCluster - 需要在标记var中包装动态addMarkers

时间:2012-01-31 18:30:08

标签: google-maps google-maps-api-3

我有一个v3 Google地图可以正常使用动态标记,但我正在尝试添加Google文档中详述的MarkerCluster功能: http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/docs/examples.html

<script type="text/javascript">

 var center = null;
var image = new google.maps.MarkerImage(
'combined.png',
 new google.maps.Size(31,25),
 new google.maps.Point(0,0),
 new google.maps.Point(16,25)
);


        var map = null;
        var currentPopup;
        var bounds = new google.maps.LatLngBounds();
        function addMarker(lat, lng, info) {
            var pt = new google.maps.LatLng(lat, lng);
            bounds.extend(pt);
            var marker = new google.maps.Marker({
                position: pt,
               icon: image,
                map: map
            });
            var popup = new google.maps.InfoWindow({
                content: info,
                maxWidth: 300
            });
            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: 4,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                mapTypeControl: true,
                mapTypeControlOptions: {
                style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR
                },
                navigationControl: true,
                navigationControlOptions: {
                 style: google.maps.NavigationControlStyle.DEFAULT
                }

            });





var mcOptions = {gridSize: 50, maxZoom: 15};
var markers = [];
<?php
do {
$name=$row_rsCity['PARKNAME']; 
$lat=$row_rsCity['lat'];
$lon=$row_rsCity['lng'];
$desc=$row_rsCity['PARKADDR'];
$city=$row_rsCity['PARKCITY'];
$spaces=$row_rsCity['SPACE_CNT'];
$phone=$row_rsCity['PHONE'];
echo ("addMarker($lat, $lon,'<b>$name</b><br/>$desc<br/>$city , CA<br /><br />Phone:     $phone <br />Space Count: $spaces');\n");
} while ($row_rsCity = mysql_fetch_assoc($rsCity));
?>
var mc = new MarkerClusterer(map, markers, mcOptions);
center = bounds.getCenter();
map.fitBounds(bounds);

}
</script>

我相信关键是包装var markers = [];在addMarkers周围,但是当我这样做时

示例:

var markers = [
<?php
do {
$name=$row_rsCity['PARKNAME']; 
$lat=$row_rsCity['lat'];
$lon=$row_rsCity['lng'];
$desc=$row_rsCity['PARKADDR'];
$city=$row_rsCity['PARKCITY'];
$spaces=$row_rsCity['SPACE_CNT'];
$phone=$row_rsCity['PHONE'];
echo ("addMarker($lat, $lon,'<b>$name</b><br/>$desc<br/>$city , CA<br /><br />Phone:     $phone <br />Space Count: $spaces');\n");
} while ($row_rsCity = mysql_fetch_assoc($rsCity));
?>];

Firebug返回以下错误:

missing ] after element list

任何人都可以帮助使用正确的语法吗?

1 个答案:

答案 0 :(得分:1)

更新你的addMarker函数以返回标记并接受map作为参数:

function addMarker(map, lat, lng, info) {
  var pt = new google.maps.LatLng(lat, lng);
  bounds.extend(pt);
  var marker = new google.maps.Marker({
    position: pt,
    icon: image,
    map: map
  });
  var popup = new google.maps.InfoWindow({
    content: info,
    maxWidth: 300
  });
  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() {
    currentPopup = null;
  });

  return marker;
}

然后将标记创建部分更新为:

var mcOptions = {gridSize: 50, maxZoom: 15};
var markers = [];
<?php
do {
  $name=$row_rsCity['PARKNAME']; 
  $lat=$row_rsCity['lat'];
  $lon=$row_rsCity['lng'];
  $desc=$row_rsCity['PARKADDR'];
  $city=$row_rsCity['PARKCITY'];
  $spaces=$row_rsCity['SPACE_CNT'];
  $phone=$row_rsCity['PHONE'];
  echo ("markers.push(addMarker(map, $lat, $lon,'<b>$name</b><br/>$desc<br/>$city CA<br /><br />Phone: $phone <br />Space Count: $spaces'));\n");
} while ($row_rsCity = mysql_fetch_assoc($rsCity));
?>
var mc = new MarkerClusterer(map, markers, mcOptions);