0

几天来，我一直在尝试在 Google 地图上将标记添加到集群中，但我不知道如何实现代码

我有这张地图-> https://maps.google.com/maps/ms?msid=211137438455901265530.0004cbb2cd7859b1b6c75&msa=0&ll=7.710992,-2.8125&spn=137.343849,307.96875

嵌入本网站 -> projectevomap.yolasite.com/

并想在这张地图上添加集群 - > http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/examples/simple_example.html

这是该页面的源代码->

查看源：http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/examples/simple_example.html

基本上，我可以通过一些指导来了解如何获取现有代码并对其进行更改，以便它在我的站点上显示我的地图和集群。我原以为这只是通过将源代码中的一小部分更改为将其定向到我的地图而不是示例（？）的地址，但我可能错了。

4

2 回答 2

1

因此，您目前所做的只是将 Google 地图嵌入到您的网页中。相反，您需要做的是使用 Google Maps API 将 Google Map 直接添加到您的页面，即不使用您的自定义地图。然后，您必须添加所有需要的标记，包括 markerclusterer JS 文件，并初始化 markerClusterer。

事实上就像这样！

 <script type="text/javascript">
      function initialize() {
        var center = new google.maps.LatLng(37.4419, -122.1419);

        var map = new google.maps.Map(document.getElementById('map'), {
          zoom: 3,
          center: center,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        });

        var markers = [];
        for (var i = 0; i < 100; i++) {
          var dataPhoto = data.photos[i];
          var latLng = new google.maps.LatLng(dataPhoto.latitude,
              dataPhoto.longitude);
          var marker = new google.maps.Marker({
            position: latLng
          });
          markers.push(marker);
        }
        var markerCluster = new MarkerClusterer(map, markers);
      }
      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
于 2012-10-19T08:45:47.020 回答
0

如果你使用 angular，有一个非常易于使用的指令就是为此而设计的：

https://github.com/arnauddri/ng-clustered-map/

于 2015-01-28T23:19:52.620 回答