3

我们正在使用 Wordpress 创建一个站点，该站点集成了 Gmaps 系统以显示钓鱼点的位置。它由与每个州关联的帖子以及输入自定义字段的经度和纬度填充。地图工作正常。问题是某些州有 1000 多个标记，这会导致页面加载出现一些滞后，并且标记相互堆叠，使用起来很荒谬。我们想做的是在完全显示任何标记之前对引脚数量进行限制。澄清：

  1. 例如，加利福尼亚州有 1000 多个湖泊，但亚利桑那州只有大约 165 个。如果总数超过 200，则应向访问者显示一条简单的消息，即“条目太多，请放大以查看选择”或类似内容。然后，
  2. 当他们放大时，它会重新计算总数，当它低于 200 时（或者我们实际设定的任何限制，只有这么多州有更多）然后标记将根据放大的区域显示

他们到达状态页面时的视图显示了整个状态和所有标记。如果超过 200 个计数，那么它应该只是显示消息以放大等等。最终将列出超过 50,000 个湖泊，因此此修改将极大地帮助页面加载。

这是我们目前正在使用的代码，用于提取数据并显示地图：

<script type="text/javascript">
jQuery(document).ready(function(){
  function initialize() {
    var myLatlng = new google.maps.LatLng(<?php echo $center_final; ?>);
    var myOptions = {
      zoom: <?php echo $zoom; ?>,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.<?php echo $type; ?>
    };
    var map = new google.maps.Map(document.getElementById("featured_overview"),  myOptions);
    <?php if(get_option('woo_maps_archive_scroll') == 'true'){ ?>
    map.scrollwheel = false;
    <?php } ?>
    <?php foreach($coords as $c_key => $c_value) { ?>
    var point = new google.maps.LatLng(<?php echo $c_value['coords']; ?>);
    var root = "<?php bloginfo('template_url'); ?>";
    var the_link = '<?php echo get_permalink($c_key); ?>';
    <?php $title = str_replace(array('&#8220;','&#8221;'),'"',get_the_title($c_key)); ?>
    <?php $title = str_replace('&#8211;','-',$title); ?>
    <?php $title = str_replace('&#8217;',"`",$title); ?>
    <?php $title = str_replace('&#038;','&',$title); ?>
    var the_title = '<?php echo html_entity_decode($title) ?>';
    var color = '<?php echo $c_value['color']; ?>';
    createMarker(map,point,root,the_link,the_title,color);
    <?php } ?>
  }
  initialize();
});
</script>

任何帮助将不胜感激。在此先感谢所有人。

4

1 回答 1

2

为什么不使用MarkerClusterer库。它专为此类场景而设计，因此您可以设置聚类的分辨率和距离。..您还可以绑定事件（如果您坚持使用 200 之类的数字）。

（实际上，我有一个未发布的 wordpress 插件就是这样做的 - 插入地图并在帖子的基础上修复集群）

于 2012-07-12T05:30:39.143 回答