2

在过去的几周里，我一直在尝试在我的网站中实施 markerclusterer，但我尝试过的一切都失败了。我完全没有代码经验，所以我所做的一切都是反复试验。

我尝试添加markerclusterer 的网站是rfmaps.com.au。

我不确定我做错了什么，需要修复什么，真的只需要一些好的建议和帮助。

这是我一直在尝试的 html 代码。这段代码只是我能从论坛中找到的所有点点滴滴，全部粘在一起，并稍作编辑（我可以从论坛的帮助中弄清楚）

<!DOCTYPE html>
<html>
  <head>
    <style>
      html, body, #map-canvas {
        margin: 0;
        padding: 0;
        height: 100%;
      }
    </style>
    <script type="text/javascript"
            src="http://maps.google.com/maps/api/js?sensor=false">
    </script>
    <script type="text/javascript">
      var map;
      var layerl0;
      function initialize() {
        map = new google.maps.Map(document.getElementById('map-canvas'), {
          center: new google.maps.LatLng(-25, 133),
          zoom: 5,
          mapTypeId: google.maps.MapTypeId.HYBRID
        });

        for (var i = 0; i < 1000; ++i) {
          var latLng = new google.maps.LatLng(data.photos[i].latitude,
                                              data.photos[i].longitude)
          var marker = new google.maps.Marker({
            position: latLng,
            draggable: true,
            icon: markerImage
          });
          markers.push(marker);
        }

        var map = new google.maps.Map(document.getElementById("map"), options);
        var mc = new MarkerClusterer(map);

        layerl0 = new google.maps.FusionTablesLayer({
          query: {
            select: "'col2'",
            from: '1UxncvVQSGcSvuN3t686sNuDQUsn8vQ6mws3zsvk'
          },
          map: map,
          styleId: 4,
          templateId: 1
        });
      }
      function changeMapl0() {
        var searchString = document.getElementById('search-string-l0').value.replace(/'/g, "\\'");
        layerl0.setOptions({
          query: {
            select: "'col2'",
            from: '1UxncvVQSGcSvuN3t686sNuDQUsn8vQ6mws3zsvk',
            where: "'Location' CONTAINS IGNORING CASE '" + searchString + "'"
          }
        });
      }
      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
    <div id="map-canvas"></div>
    <div style="margin-top: 10px;">
      <label>Location</label><input type="text" id="search-string-l0">
      <input type="button" onClick="changeMapl0()" value="Search">
    </div>
  </body>
</html>

4

1 回答 1

2

我认为您在地图内创建标记时没有添加“地图”对象。

这是你的代码：

var marker = new google.maps.Marker({
           position: latLng,
           draggable: true,
           icon: markerImage
          });

请在生成标记时添加 map: map，如下所示：

var marker = new google.maps.Marker({
           map: map,
           position: latLng,
           draggable: true,
           icon: markerImage
          });

关于标记集群，您需要添加此 js 文件 -markerclusterer.js

markerCluster = new MarkerClusterer(map, marker);
于 2013-06-16T17:06:43.887 回答