Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/383.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Google Maps API v3中的多个标记在单击时链接到不同的页面_Javascript_Api_Google Maps - Fatal编程技术网

Javascript Google Maps API v3中的多个标记在单击时链接到不同的页面

Javascript Google Maps API v3中的多个标记在单击时链接到不同的页面,javascript,api,google-maps,Javascript,Api,Google Maps,我有一个带有多个标记的地图,我通过数组填充它。每个标记都是可单击的,每个标记都应将用户带到不同的url 问题是,所有标记在显示正确标题时,都使用数组中最后一个条目的url 这是我的密码: var myOptions = { zoom: 9, center: new google.maps.LatLng(40.81940575,-73.95647955), mapTypeId: google.maps.MapTypeId.TERRAIN } var map = new google.maps.Ma

我有一个带有多个标记的地图,我通过数组填充它。每个标记都是可单击的,每个标记都应将用户带到不同的url

问题是,所有标记在显示正确标题时,都使用数组中最后一个条目的url

这是我的密码:

var myOptions = { zoom: 9, center: new google.maps.LatLng(40.81940575,-73.95647955), mapTypeId: google.maps.MapTypeId.TERRAIN }
var map = new google.maps.Map(document.getElementById("bigmap"), myOptions);
setMarkers(map, properties);

var properties = [
['106 Ft Washington Avenue',40.8388485,-73.9436015,'Mjg4'],
['213 Bennett Avenue',40.8574384,-73.9333426,'Mjkz'],
['50 Overlook Terrace',40.8543752,-73.9362542,'Mjky'],
['850 West 176 Street',40.8476012,-73.9417571,'OTM='],
['915 West End Avenue',40.8007478,-73.9692155,'Mjkx']];

function setMarkers(map, buildings) {
    var image = new google.maps.MarkerImage('map_marker.png', new google.maps.Size(19,32), new google.maps.Point(0,0), new google.maps.Point(10,32));
    var shadow = new google.maps.MarkerImage('map_marker_shadow.png', new google.maps.Size(28,32), new google.maps.Point(0,0), new google.maps.Point(10,32));
    var bounds = new google.maps.LatLngBounds;
    for (var i in buildings) {
        var myLatLng = new google.maps.LatLng(buildings[i][1], buildings[i][2]);
        bounds.extend(myLatLng);
        var marker = new google.maps.Marker({ position: myLatLng, map: map, shadow: shadow, icon: image, title: buildings[i][0] });
        google.maps.event.addListener(marker, 'click', function() { window.location = ('detail?b=' + buildings[i][3]); });
    }
    map.fitBounds(bounds);
}
使用此代码,单击任何标记将用户带到“detail?b=Mjkx”


我做错了什么?

问题是您的单击处理程序正在使用外部函数中的
I
变量

执行循环不会在每次迭代中单独复制变量,因此回调函数对所有回调使用相同的
i

要修复它,请编写一个单独的函数来生成回调

例如:

function buildClickHandler(i) {
    return function() { window.location = ('detail?b=' + buildings[i][3]); };
}

for(var i = 0; i < buildings.length; i++) {
    //...
    google.maps.event.addListener(marker, 'click', buildClickHandler(i));
}
函数buildClickHandler(i){
返回函数(){window.location=('detail?b='+buildings[i][3]);};
}
对于(var i=0;i
(您需要在
setMarkers
内部定义
buildClickHandler
,以便它可以使用
buildings
参数)

顺便说一句,当在数组中循环时,您将看到,因为它还将迭代数组对象上的任何其他成员