Gmap3多个标记加载缓慢。 怎么解决？

Question

我正在使用Gmap3将Google Map加载到我的网站上。 在此地图内，有100多个标记。 问题在于地图加载非常缓慢，需要花费一分钟的时间来加载整个地图。

如何使用很多标记来加快地图的加载速度？

我正在使用最新版本的Gmap3（v6），并且正在使用jQuery 2.1。

我尝试将缩放级别更改为更近的视图，但这没有用。 我还删除了绿色标记，但这也没有加快速度。

我想知道将方法从地址更改为纬度和经度是否可以帮助加快处理速度，但是如果这样做几乎没有好处，那会花费很多时间。

从使用Firebug所见，脚本似乎正在请求每个标记，将它们全部获取，然后显示标记。 每个标记平均需要100毫秒（大约）的时间。

有没有办法加快速度？ 也许一次请求多个标记？

编辑

在Gmap3的网站上进行研究时，我遇到了集群问题。 我实现了下载文件中提供的示例，但加载速度仍然很慢。

var RetailList = [
  {address:'5555 Brighton Blvd., Denver, CO 80216', data:'<a href="#id1" class="fancybox rls">Store Location 1</a>'},
  //Additional locations using same markup as above.
];

$(function() {

    $("#rec-map").gmap3({
  map:{
    options:{
      center:[39.739, -104.9847],
      zoom: 9
    }
  },
 marker: {
            values: RetailList,
            cluster:{
              radius:100,
              0: {
                content: "<div class='cluster cluster-1'>CLUSTER_COUNT</div>",
                width: 53,
                height: 52
              },
              20: {
                content: "<div class='cluster cluster-2'>CLUSTER_COUNT</div>",
                width: 56,
                height: 55
              },
              50: {
                content: "<div class='cluster cluster-3'>CLUSTER_COUNT</div>",
                width: 66,
                height: 65
              },
              events: {
                click: function(cluster) {
                  var map = $(this).gmap3("get");
                  map.setCenter(cluster.main.getPosition());
                  map.setZoom(map.getZoom() + 1);
                }
              }
            },
            options: {
              icon: new google.maps.MarkerImage("http://maps.gstatic.com/mapfiles/icon_green.png"),
              draggable: false
            },
    events:{
      mouseover: function(marker, event, context){
        var map = $(this).gmap3("get"),
          infowindow = $(this).gmap3({get:{name:"infowindow"}});
        if (infowindow){
          infowindow.open(map, marker);
          infowindow.setContent(context.data);
        } else {
          $(this).gmap3({
            infowindow:{
              anchor:marker,
              options:{content: context.data}
            }
          });
        }
      } /* ,
      mouseout: function(){
        var infowindow = $(this).gmap3({get:{name:"infowindow"}});
        if (infowindow){
          infowindow.close();
        }
      } */
    }
   }
  });
});

Answer 1

事实证明，从使用地址更改为经度/纬度是可行的。 我还将它与Gmap3的群集功能结合使用，它现在可以快速，平稳地工作。

上面的代码有效，但是更改了以下行：

这个：

{address:'5555 Brighton Blvd., Denver, CO 80216', data:'<a href="#id1" class="fancybox rls">Store Location 1</a>'},
 //Additional locations using same markup as above.

变成了：

{lat:39.777648,lng:-104.969998, data:'<a href="#id1" class="fancybox rls">Store Location 1</a>'},
 //Additional locations using same markup as above.

我相信这样做的原因是使用脚本必须查找地址并返回正确位置的地址。 使用经度和纬度，只有一个位置，它可以快速绘制位置。