如何在循环中创建谷歌地图标记，例如"Marker1"、"Marker2"

Question

对于这个新手的问题，我很抱歉，但是我没有找到任何解决这个问题的方法。

我想在谷歌地图上创建4个标记(或更多，但这里是4个)。我使用get ajax请求获取信息，并使用JSON进行响应。我可以创建这些标记，但是我对每个标记的信息窗口有一个问题。

这里是我试过的代码:

    function readDevices(output){
// Get an array for the 4 devices with guid 42421 42422 42423 and 42424
        var arrayOfDevices = new Array();
        $.each(output.data, function(key, value){
            $.each(value, function(deviceKey, deviceValue){
                if(deviceKey == 'guid' && deviceValue >= 42421 && deviceValue <= 42424){
                    arrayOfDevices.push(value); // add the entire object in the tab
                }
            });
        });
        for(var i = 0; i < arrayOfDevices.length; i++){
            var guid = arrayOfDevices[i]["guid"];
            var latitude = arrayOfDevices[i]["latitude"];
            var longitude = arrayOfDevices[i]["longitude"];
            var name = arrayOfDevices[i]["name"];
            var coord = new google.maps.LatLng(latitude, longitude);
            var contentString = '<div id="content">'+
                '<form method="get" action="manual" id="form-new">'+
                    '<button type="submit" id="new-button" name="'+guid+'" class="btn new-btn">Manual</button>'+
                '</form>'+
                '</div>';
            var infowindow = new google.maps.InfoWindow({
                content: contentString
            });
            var marker = new google.maps.Marker({
                position: coord,
                title: name
            });
            marker.setMap(map);
            google.maps.event.addListener(marker, 'click', function() {
                infowindow.open(map, marker);
            });
        }
    }

此代码在正确的位置放置了4个标记。但是当我点击其中一个标记时，"弹出窗口"出现在我创建的最后一个标记附近。我想为每个标记设置信息窗口。

我不能这样做:

var marker+i = new google.maps.Marker();

…但是也许有一些技巧可以让你做一些类似的事情呢?

我希望我说的很清楚^^'

谢谢大家的帮助!: -)

KhorneHoly答案后的正确代码!

function addMarker(markerData, map){
    var contentString = '<div id="content">'+
        '<form method="get" action="manual" id="form-new">'+
            '<button type="submit" id="new-button" name="'+markerData["guid"]+'" class="btn new-btn">Manual</button>'+
        '</form>'+
        '</div>';
    var infowindow = new google.maps.InfoWindow({
        content: contentString
    });
    var LatLng = new google.maps.LatLng(markerData["latitude"], markerData["longitude"]);
    var marker = new google.maps.Marker({
        position: LatLng,
        map: map
    });
    google.maps.event.addListener(marker, 'click', function() {
        infowindow.open(map, marker);
    });
}
function readDevices(output){
    var arrayOfDevices = new Array();
    var markers = new Array();
    $.each(output.data, function(key, value){
        $.each(value, function(deviceKey, deviceValue){
            if(deviceKey == 'guid' && deviceValue >= 42421 && deviceValue <= 42424){
                arrayOfDevices.push(value);
            }
        });
    });
    for(var i = 0; i < arrayOfDevices.length; i++){
        var guid = arrayOfDevices[i]["guid"];
        var latitude = arrayOfDevices[i]["latitude"];
        var longitude = arrayOfDevices[i]["longitude"];
        var name = arrayOfDevices[i]["name"];
        var coord = new google.maps.LatLng(latitude, longitude);
        markers.push(addMarker(arrayOfDevices[i], map));
    }
}

Answer 1

您想要做的是不可能的，因为您不能生成这样的变量。但你能做的是生成一个数组用for循环中的标记符填充，像这样:

var markers = new Array();    
for (var i = 0; i < ArrayWithYourResultYouWantGenerateTheMarkersFrom.length; ++i) {
    markers.push(addMarker(ArrayWithYourResultYouWantGenerateTheMarkersFrom.[i], map));
}
public function addMarker(markerData, map){
    var LatLng = new google.maps.LatLng(markerData.lat, markerData.lon);
    var marker = new google.maps.Marker({
        position: LatLng,
        map: map,
}