在Google Maps v3 API中为数组中的标记clusterin选择多个标记

这个问题与这篇文章有关：将简单标记聚类器添加到谷歌地图我想知道如何尽可能简单地调用数组中的标记。这是我的代码：

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
    // Set up three markers with info windows

    var point = new google.maps.LatLng(43.65654, -79.90138);
    var marker1 = createMarker(point, 'Abc');

    var point = new google.maps.LatLng(43.91892, -78.89231);
    var marker2 = createMarker(point, 'Abc');

    var point = new google.maps.LatLng(43.82589, -79.10040);
    var marker3 = createMarker(point, 'Abc');

    var point = new google.maps.LatLng(43.65654, -79.90138);
    var marker4 = createMarker(point, 'Abc');

    var point = new google.maps.LatLng(43.91892, -78.89231);
    var marker5 = createMarker(point, 'Abc');

    var point = new google.maps.LatLng(43.82589, -79.10040);
    var marker6 = createMarker(point, 'Abc');

    var markerArray = new Array(marker1, marker2, marker3, marker4, marker5, marker6);

    mc.addMarkers(markerArray , true);
}

var infowindow = new google.maps.InfoWindow({
    size: new google.maps.Size(150, 50)
});

function createMarker(latlng, html) {
    var contentString = html;
    var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        zIndex: Math.round(latlng.lat() * -100000) << 5
    });

    google.maps.event.addListener(marker, 'click', function() {
        infowindow.setContent(contentString);
        infowindow.open(map, marker);
    });

    return marker;
}

window.onload = initialize;

问题是这部分：

var markerArray = new Array(marker1, marker2, marker3, marker4, marker5, marker6);

是否有可能避免命名每个标记并使用类似的东西

var markerArray = new Array(marker1-marker100);

已邀请:

1 个回复

净爽

这是jsfiddle演示：如果您需要帮助理解，请告诉我全局范围数组用于跟踪所有点和标记：

var map = null;
var markerArray = []; //create a global array to store markers
var myPoints = [[43.65654, -79.90138, 'ABC'],[43.91892, -78.89231, 'DEF'],[43.82589, -79.10040, 'GHA']];  //create global array to store points

在initialize函数内基本上循环遍历myPoints全局数组并基于此创建标记。因此，要添加更多标记，您只需使用lat，lng和html提供myPoints数组：

// Add markers to the map
// Set up based on the number of points in myPoints array 
for(var i=0; i<myPoints.length; i++){
     createMarker(new google.maps.LatLng(myPoints[i][0], myPoints[i][1]), myPoints[i][2]);
}

mc.addMarkers(markerArray , true);

在creatMarker函数中，我们通过将局部var标记推入全局数组markerArray来更改以下内容：

function createMarker(latlng, html) {
    var contentString = html;
    var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        zIndex: Math.round(latlng.lat() * -100000) << 5
    });

    google.maps.event.addListener(marker, 'click', function() {
        infowindow.setContent(contentString);
        infowindow.open(map, marker);
    });

    markerArray.push(marker); //push local var marker into global array
}

现在，如果您要添加新标记，您只需将lat，lng和html作为子数组添加到myPoints数组中：

var myPoints = [[43.65654, -79.90138, 'ABC'],[43.91892, -78.89231, 'DEF'],[43.82589, -79.10040, 'GHA'], [10, -22, 'MY NEW MARKER']];

所以就像[lat，lng，html]

要回复问题请先登录或注册

在Google Maps v3 API中为数组中的标记clusterin选择多个标记

1 个回复

发起人

markerclusterer

问题状态

在Google Maps v3 API中为数组中的标记clusterin选择多个标记

与内容相关的链接

1 个回复

发起人

markerclusterer

问题状态