谷歌地图蜘蛛集群

google map spiderfier cluster

本文关键字:谷歌地图      更新时间:2023-09-26

关于 spiderfier 集群的问题,我设法让它与 markerClusterer 一起使用,但是有没有办法在放大时自动爬虫它,这样它就不会在地图缩放时只显示 1 个标记?

假设如果您达到 maxZoom 级别 11,那么它应该会自动蜘蛛化标记。

这是我的蜘蛛机选项:

 var oms = new OverlappingMarkerSpiderfier(map, {keepSpiderfied : true, markersWontMove : false, circleSpiralSwitchover: 5});

谢谢

(function(){

var gm = google.maps;
var config = {
    el: 'map',
    lat: 37.4419,
    lon: -122.1419,
    zoom: 15,
    minZoom: 15,
    type: google.maps.MapTypeId.ROADMAP
};
var spiderConfig = {
    keepSpiderfied: true,
    event: 'mouseover'
};
// A list of Markers with the same location
var data = [
    {lat: 37.4419, lon: -122.1419, title: 'location 1'},
    {lat: 37.4419, lon: -122.1419, title: 'location 2'},
    {lat: 37.4419, lon: -122.1419, title: 'Marker same location 3'},
    {lat: 37.4419, lon: -122.1419, title: 'Marker same location 4'},
    {lat: 37.4419, lon: -122.1419, title: 'Marker same location 5'},
    {lat: 37.4419, lon: -122.1419, title: 'Marker same location 6'},
    {lat: 37.4419, lon: -122.1419, title: 'Marker same location 7'},
    {lat: 37.4419, lon: -122.1419, title: 'Marker same location 8'},
    {lat: 37.4419, lon: -122.1419, title: 'Marker same location 9'}
];

function initialize() {
    var map = new gm.Map(document.getElementById(config.el), {
        zoom: config.zoom,
        center: new gm.LatLng(config.lat, config.lon),
        mapTypeId: config.type
    });

    var markerSpiderfier = new OverlappingMarkerSpiderfier(map, spiderConfig);
    var markers = [];

    for (var x in data) {
        var loc = new gm.LatLng(data[x].lat, data[x].lon);
        var marker = new gm.Marker({
            position: loc,
            title: data[x].title,
            map: map
        });
        marker.desc = data[x].title;
        markers.push(marker); // Saving Markers
        markerSpiderfier.addMarker(marker);  // Adds the Marker to OverlappingMarkerSpiderfier
    }

    var iw = new gm.InfoWindow();
    markerSpiderfier.addListener('click', function(marker, e) {
        iw.setContent(marker.title);
        iw.open(map, marker);
    });
    markerSpiderfier.addListener('spiderfy', function(markers) {
        iw.close();
    });

    var markerCluster = new MarkerClusterer(map, markers);
    markerCluster.setMaxZoom(config.minZoom);
}
gm.event.addDomListener(window, 'load', initialize);

})();