标签: markerclusterer

将简单标记聚类器添加到谷歌地图

我在向地图添加标记聚类功能时遇到问题.我想要的是为我的标记使用自定义图标,每个标记都有自己的信息窗口,我希望能够编辑.

我确实做到了,但现在我在添加marker clusterer库功能时遇到了问题.我读了一些关于向数组中添加标记的内容,但我不确定它究竟意味着什么.此外,我发现的所有数组示例都没有信息窗口,搜索代码我没有找到合适的方法来添加它们.

这是我的代码(主要来自Geocodezip.com):

    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
    <script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/src/markerclusterer.js"></script>
    <style type="text/css">
    html, body { height: 100%; } 
    </style>
<script type="text/javascript"> 
//<![CDATA[
var map = null;
function initialize() {
  var myOptions = {
    zoom: 8,
    center: new google.maps.LatLng(43.907787,-79.359741),
    mapTypeControl: true,
    mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
    navigationControl: true,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  map = new google.maps.Map(document.getElementById("map_canvas"),
                                myOptions);

var mcOptions = {gridSize: 50, maxZoom: 15};
var mc = new MarkerClusterer(map, [], mcOptions);

      google.maps.event.addListener(map, 'click', function() {
            infowindow.close();
            });

      // Add markers to the map
      // …
Run Code Online (Sandbox Code Playgroud)

javascript google-maps google-maps-api-3 markerclusterer

8
推荐指数
1
解决办法
4万
查看次数

标记集群在设置后不会改变

目前我有一组标记,我将它们聚类为:

var markerCluster = new MarkerClusterer(map, cm_mapMarkers);
Run Code Online (Sandbox Code Playgroud)

但我也有一组过滤器,用于设置标记可见的虚假或真实.不幸的是,当我设置标记setvisible(false)时,簇计数没有改变.

所以我找了方法来做到这一点:

我尝试了以下方法:

MarkerClusterer.redraw();
MarkerClusterer.repaint();
Run Code Online (Sandbox Code Playgroud)

两者都导致:没有方法'重绘'没有方法'重绘'

这是一个JSfiddle:

http://jsfiddle.net/tDYcX/30/

谁知道我做错了什么?

提前致谢

visibility google-maps-api-3 markerclusterer

8
推荐指数
1
解决办法
6760
查看次数

如何在谷歌地图中隐藏和显示MarkerClusterer

我正试图在用户点击某些按钮时隐藏/显示markerClusterer:

这是我正在尝试做的事情:

    map = new google.maps.Map(document.getElementById("mappa"),mapOptions);
    var marker_tmp = [];
    var markers_tmp = [];
    $.each(json,function(index,value){
        var latLng = new google.maps.LatLng(value.lat,value.lng);
        var marker = new google.maps.Marker({'position': latLng});
        if((value.candidato in markers_tmp)==false){
            markers_tmp[value.name]=[];
        }
        markers_tmp[value.name].push(marker);
    });
    for(var name in markers_tmp){
        markers[name]= new MarkerClusterer(map,markers_tmp[name]);
    }
Run Code Online (Sandbox Code Playgroud)

我创建了多个markerClusterer,每个都与一个特定的名称相关联.

所以我有一些与这些特定名称相关的按钮,我需要隐藏/显示与该按钮关联的标记聚类.

/*This is the function associated to a button when it is clicked*/
function hide_show_cluster(name,visible){
    var tmp_cluster = markers[name];
    //call a function of markerClusterer (tmp_cluster) to hide/show it
}
Run Code Online (Sandbox Code Playgroud)

我做了很多测试,但没有人满足我的要求.有人能帮我吗?谢谢!

javascript show-hide google-maps-markers markerclusterer

8
推荐指数
2
解决办法
1万
查看次数

谷歌地图API V3- MarkerClusterer未定义

我按照库和youtube指南将标记聚类器添加到我的地图但我遇到了问题.

MarkerClusterer undefined
Run Code Online (Sandbox Code Playgroud)

我已将MarkerClusterer定义为指南中的show,但仍然出现上述错误.下面是我的代码

<!DOCTYPE html>
<html lang="fr" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemasmicrosoft-
com:vml">
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
<meta charset="UTF-8" />
<title>Ma Page de Google Maps V3</title>
<style>
        html, body, #map_canvas {
    margin: 3;
    padding: 3;
    height: 100%;
  }
</style>
<style type="text/css">
    .tooltip {
    background-color:#ffffff;
    font-weight:bold;
    border:2px #006699 solid; 
    width:150px}
</style>
<script src="http://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script src="http://www.google.com/jsapi"></script>
<script src="../src/data.json" type="text/javascript"></script>
<script type="text/javascript">
  var script = '<script type="text/javascript" src="../src/markerclusterer';
  if (document.location.search.indexOf('compiled') !== -1) {
    script += '_compiled';
  }
  script += '.js"><' + '/script>';
  document.write(script);
</script> …
Run Code Online (Sandbox Code Playgroud)

javascript google-maps-api-3 markerclusterer

8
推荐指数
2
解决办法
2万
查看次数

从markerClusterer中删除标记

我正在尝试创建一个带有集群的交互式地图,当用户选中一个框时需要显示该集合,并在再次取消选中该框时将其删除.到目前为止一切运行良好,集群工作和一切,但我注意到一个奇怪的行为,我无法解释和修复:每次我取消选中该框并再次检查它,群集中显示的数字会增加该区域中的标记量(因此,当我执行"clearMarkers"时,它不会以某种方式重置为零)

以下是相关功能的代码:

//Display or remove PREDICTED accident's markers.
function toDisplayPredictedAccidents ()
{
    //If the checkbox is checked : Display all the PREDICTED accident's markers.
    if(checkBoxPredicted.checked == true)
    {
        for (i = 0; i < predictedAccidentArray.length; i++) 
        {  
            marker = new google.maps.Marker
            ({
                position: new google.maps.LatLng(predictedAccidentArray[i][1], predictedAccidentArray[i][2]),
                icon : iconPredicted
            });
            markersPredicted.push(marker); //Put the created marker in an array.


           //Create the pop-up when we click on the marker.
           google.maps.event.addListener(marker, 'click', (function(marker, i)
           {
              return function() 
              {
                  infowindow.setContent(predictedAccidentArray[i][0]);
                  infowindow.open(map, marker);
              }
           })(marker, …
Run Code Online (Sandbox Code Playgroud)

maps cluster-computing markerclusterer

8
推荐指数
2
解决办法
1万
查看次数

当同一位置有多个标记时,重叠标记Spiderfier标记图标

Google地图不提供拆分位于同一位置的多个标记的方法.这可能发生在多个居住地点的人或企业,例如公寓楼或专业服务楼.根据缩放级别,它也可以在购物中心等处发生.

解决这个问题的方法是"蜘蛛网":当点击第一个时,它会用一条线将它们分开.这是在Google地球中完成的,George MacKerron为谷歌地图编写了一个包.(https://github.com/jawj/OverlappingMarkerSpiderfier)

它可以与markerclusterer集成,但它不支持marker clusterer批量创建标记.

我的问题是我正在处理的应用程序想要为不同类型的活动提供特定的图标.Spiderfier将其中一个标记置于顶部.看地图的人无法知道顶部标记下方可能有10个或更多其他标记.

理想情况下,当有多个标记类似于markercluster中的不同图标时,会有一种方法可以显示顶部标记.它不是直接的1对1,因为蜘蛛侠在它们靠近但不完全在同一位置(默认为20像素)时也可以工作,并且markercluster没有提供在完全相同的位置访问多个标记.

理想的行为将是蜘蛛的特殊图标,当点击时它会闯入蜘蛛状的个体图标.与markersclusterer类似,但没有变焦和处理相同的位置.理想情况下,特殊图标将指示现场有多少其他标记,再次类似于markerclusterer.特殊图标可以隐藏或成为蜘蛛网组的一部分.

如果没有一些住宿,用户就无法知道该地点有多个活动.他们甚至可能认为他们想要的活动不在那个位置,因为显示了另一个活动标记.

这是一个有问题的plunker:http://plnkr.co/edit/vimZNq?p = info

  var markers = [];
  var bounds = new google.maps.LatLngBounds();
  for (var i = 0; i < 100; ++i) {
    var latLng = new google.maps.LatLng(Math.floor(Math.random() * 10) / 10 + 39,
      Math.floor(Math.random() * 10) / 10 - 100);
    var marker = new google.maps.Marker({
      position: latLng,
      title: "marker " + i + " pos: " + latLng,
      maxZoom: 8,
      map: map

    });
    marker.desc = marker.getTitle();
    bounds.extend(latLng); …
Run Code Online (Sandbox Code Playgroud)

google-maps markerclusterer markerspiderfier

8
推荐指数
2
解决办法
4351
查看次数

Android,地图群集完成后回调

我在我的应用中使用Google Maps及其群集实用程序.群集本身工作正常,但是当我尝试处理配置更改时,我遇到了问题.

这是我的情况:

  1. 用户在屏幕上看到地图,这是一个fragment.
  2. 完成聚类后,将显示地图上的标记.用户可以与之互动markers.
  3. 当用户选择a时marker,它会突出显示并BottomSheet展开以显示.

如果用户旋转屏幕(即配置更改发生),我保存选择使用的标记onSaveInstanceState(实际上我不保存标记本身,但只保存相关List条目的链接,如ID).然后,我想恢复配置更改之前的用户选择.

集群本身就像这样执行:

clusterManager.clearItems();
clusterManager.addItems(eventManager.getEventList());
clusterManager.cluster(); 
Run Code Online (Sandbox Code Playgroud)

当从服务器接收数据时,执行该代码.执行群集时markers,显然也会重新创建所有群集.因此,为了突出显示以前的用户选择(上一个marker),我必须知道WHEN群集实用程序何时完成其操作.到那时,我确信我可以安全地使用以下功能:

clusterManager.getRenderer()).getMarker(<param>)
Run Code Online (Sandbox Code Playgroud)

clusterManager.getRenderer()).getClusterItem(<param>)
Run Code Online (Sandbox Code Playgroud)

否则,null如果集群任务尚未完成,这些将有时返回.

但是,ClusterManager当集群完成时,我找不到合理的方法,如何从集群实用程序(即)获得响应.我想我需要更新这个标准的集群代码:

 /**
     * Runs the clustering algorithm in a background thread, then re-paints when results come back.
     */
    private class ClusterTask extends AsyncTask<Float, Void, Set<? extends Cluster<T>>> {
        @Override
        protected Set<? extends Cluster<T>> doInBackground(Float... zoom) {
            mAlgorithmLock.readLock().lock();
            try {
                return mAlgorithm.getClusters(zoom[0]);
            } finally { …
Run Code Online (Sandbox Code Playgroud)

android google-maps markerclusterer google-maps-android-api-2

8
推荐指数
1
解决办法
944
查看次数

Google Maps Utility:如何从ClusterManager <?>获取所有标记?

对不起我的英语不好

我尝试了该ClusterManager<?>.getMarkerCollection().getMarkers()方法,但它返回空集合.

我在我的应用中使用Google Maps Utility Library.每次屏幕旋转后,我都会创建AsynkTask并在后台线程中从DB读取数据并将项目添加到ClusterManager:

cursor.moveToFirst();
while (!cursor.isAfterLast()) {
    SomeData row = readSomeDataRow(cursor);
    clusterManager.addItem(new ClusterItemImpl(row));
    cursor.moveToNext();
}
Run Code Online (Sandbox Code Playgroud)

AsyncTask完成它的工作(即在主线程中)我试图从以下所有标记ClusterManager:

clusterManager.cluster();
// cluster manager returns empty collection  \|/
markers = clusterManager.getMarkerCollection().getMarkers(); 
Run Code Online (Sandbox Code Playgroud)

但是ClusterManager返回空集合.

可在那一刻,当我打电话getMarkers()ClusterManager却没有放置标记在地图上和稍后会做(可在后台线程).如果是这样,那我怎么能抓住那一刻呢?

android marker markerclusterer google-maps-android-api-2

7
推荐指数
2
解决办法
7941
查看次数

角度标记聚类器不会在标记隐藏上刷新

我已经创建了一个用于显示此行为的plunker,基本上我所做的是从角度贴图中获取演示示例,并且每次点击地图上的标记时稍微更改它以隐藏5个标记.标记确实是隐藏的,但是聚类器永远不会改变.现在这里是一个奇怪的部分,如果你稍微拖动地图,它将正确更新群集,但它不会自动刷新.

onclick事件

$scope.clickHandler = function(e) {
    var count = $scope.randomMarkers.length;
    var hidden = 0;
    for (var i = 0; i < count; i++) {
        var oneModel = $scope.randomMarkers[i];
        if (oneModel.options.visible) {
           console.log("hiding: " + oneModel.latitude);
           oneModel.options.visible = false;
           hidden++;
           if (hidden == 5) break;
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

和标记定义

var ret = {
    latitude: latitude,
    longitude: longitude,
    title: 'm' + i,
    events: {
      click: $scope.clickHandler
    },
    options: {
      visible: true
    }
  };
Run Code Online (Sandbox Code Playgroud)

是与示例唯一真正的区别(除了告诉markers指令实际使用标记模型选项属性).

refresh markerclusterer angular-google-maps

7
推荐指数
0
解决办法
216
查看次数

将Google Maps MarkerClusterer与infowindow集成

我正在尝试将InfoWindow放在与MarkerClusterer分组的多个标记中,但没有成功.我只能生成带有infowindows或带有集群的地图; 不是两个在同一时间.在网上搜索让我更加困惑....

起点是谷歌开发者页面:根据我的需求,我创建了以下代码:

    <div id="map"></div>
    <script>

      function initMap() {

        var map = new google.maps.Map(document.getElementById('map'), {
          zoom: 5,
          center: {lat: -15.7942357, lng: -47.8821945}
        });

        // Add some markers to the map.
        // Note: The code uses the JavaScript Array.prototype.map() method to
        // create an array of markers based on a given "locations" array.
        // The map() method here has nothing to do with the Google Maps API.
        var markers = locations.map(function(location, i) {
          return new google.maps.Marker({
            position: location,
          }); …
Run Code Online (Sandbox Code Playgroud)

google-maps google-maps-api-3 markerclusterer

7
推荐指数
1
解决办法
1万
查看次数