谷歌地图信息窗口未打开

Google maps info window not opening

本文关键字：窗口 信息 信息窗 谷歌地图      更新时间：2023-09-26

我正在尝试使用带有谷歌地图图钉的信息窗口，但是当我单击图钉打开信息窗口时没有任何反应，我在控制台中没有收到任何错误，但该函数正在触发，因为它运行时应该有一个日志。

我从尝试用于填充列表的本地 json 文件中获取数据。

我已经通读了事件关闭，但我不确定这是否是我在这里的问题。

    function test(markers){
      var gmarkers = [];
    var mapOptions = {
        center: new google.maps.LatLng(markers.map[0].lat, markers.map[0].lng),
        zoom: 2,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var infoWindow = new google.maps.InfoWindow();
    var latlngbounds = new google.maps.LatLngBounds();
    var map = new google.maps.Map(document.getElementById("map"), mapOptions);
    var i = 0;
    var interval = setInterval(function () {
        var data = markers[i];
        var category = markers.map[i].category;
        var myLatlng = new google.maps.LatLng(markers.map[i].lat, markers.map[i].lng);
        var icon = "";
        switch (markers.map[i].type) {
            case "techstation":
            icon = "red";
            break;
            case "event":
            icon = "blue";
            break;
            case "virtual":
            icon = "yellow";
            break;
            default:
            icon = "red";
        }
        icon = "http://maps.google.com/mapfiles/ms/icons/" + icon + ".png";
        var marker = new google.maps.Marker({
            position: myLatlng,
            map: map,
            category: category,
            title: markers.map.title,
            icon: new google.maps.MarkerImage(icon)
        });
        gmarkers.push(marker);
        for (var z = 0; z < markers.map.length; z++) {
        var marker1 = markers.map[z];
        console.log(marker1.description);
        google.maps.event.addListener(marker1, 'click', function () {
          console.log("mouseover");
        infowindow.setContent(marker1.description);
        infowindow.open(map, marker1);
        });
        }
        latlngbounds.extend(marker.position);
        i++;
        if (i == markers.map.length) {
            clearInterval(interval);
            var bounds = new google.maps.LatLngBounds();
            map.setCenter(latlngbounds.getCenter());
            map.fitBounds(latlngbounds);
        }
      }, 80);

代码中有拼写错误。

您声明信息窗口 

var infoWindow = new google.maps.InfoWindow(); // notice capital "W"

而你使用 

// notice lowercase "w"
infowindow.setContent(marker1.description);
infowindow.open(map, marker1);

尝试将侦听标记单击的代码部分更改为：

for( var z = 0; z < markers.map.length; z++ ) {
    var mkr = markers.map[z];
    console.log( mkr.description );
    google.maps.event.addListener( mkr, 'click', function( event ) {
        console.log("click event triggered on marker: open infowindow");
        infoWindow.setContent( this.description );
        infoWindow.open( map, this );
        infoWindow.setPosition( this.position );/* need to set the position */
    }.bind( mkr ));/* for convenience, bind to the marker `mkr` so you can use `this` - personal preference i guess */
}
相关文章：