Question

我正在尝试为某些地图标记创建侦听器。我可以创建标记，它们在地图上，但无论我点击哪个标记，它都会告诉我"Uncaught TypeError: Cannot call method 'open' of undefined"。当我打开开放代码时，它显示标记[46]，这是最高指数的一个。并且无论我点击哪个标记始终是相同的索引。

编辑：我编辑了代码并粘贴了所有代码。没有错误，但单击标记时没有任何反应。我正在寻找Chrome，看起来没有注册事件处理程序

<script>
var map;
var nav = [];
$(document).ready(function () {
    //initialise a map
    init();
    var infowindow = new google.maps.InfoWindow({});
    $.get("xxxxxx.kml", function (data) {
        html = "";
        //loop through placemarks tags                    
        i = 1;
        $(data).find("Placemark").each(function (index, value) {
            //get coordinates and place name
            coords = $(this).find("coordinates").text();
            contentString = $(this).find("description").text();


            var partsOfStr = coords.split(',');
            var lat = parseFloat(partsOfStr[0]);
            var lng = parseFloat(partsOfStr[1]);
            var myLatLng = new google.maps.LatLng(lng, lat);
            place = $(this).find("name").text();

            createMarker(myLatLng, place, contentString, i)

            //store as JSON
            c = coords.split(",")
            nav.push({
                "place": place,
                "lat": c[0],
                "lng": c[1]
            })
            //output as a navigation
            html += "<li>" + place + "</li>";
            i++;
        });
        //output as a navigation
        $(".navigation").append(html);

        //bind clicks on your navigation to scroll to a placemark

        $(".navigation li").bind("click", function () {

            panToPoint = new google.maps.LatLng(nav[$(this).index()].lng, nav[$(this).index()].lat)

            map.panTo(panToPoint);
        })

    });
    markers = [];

    function createMarker(myLatLng, title, contentString, i) {
        var marker = new google.maps.Marker({
            position: myLatLng,
            map: map,
            title: title
        });

        google.maps.event.addListener(markers, 'click', function () {
            infoWindow.setContent(contentString);
            infowindow.open(map, markers[i]);
        });
        markers[i] = marker;
        return marker
    }

    function init() {

        //google.maps.event.addDomListener(window, 'init', Initialize);
        var latlng = new google.maps.LatLng(39.047050, -77.131409);
        var myOptions = {
            zoom: 4,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP

        };
        map = new google.maps.Map(document.getElementById("map"), myOptions);


    }


})

Answer 1

这几乎是常见问题解答。循环结束时，i的值为46（基于您的语句）。没有标记46，因此所有单击侦听器都会失败。它可以通过函数闭包来解决（createMarker函数保存标记和infowindow内容之间的关联）。

在您的示例中（未经测试），在标记创建循环中调用它，需要全局标记数组，但不需要全局infowindow数组：

//global markers array
markers = [];
// global infowindow
var infowindow = new google.maps.InfoWindow({});

// createMarker function
function createMarker(myLatLng, title, contentString, i)
{
    var marker = new google.maps.Marker({
    position: myLatlng , 
    map: map, 
    title:title
 });

  google.maps.event.addListener(markers, 'click', function() {
    infoWindow.setContent(contentString);
    infowindow.open(map,markers[i]);
  });
  markers[i] = marker;
  return marker
}

谷歌地图infowindow

1 个答案: