谷歌地图infowindow错误f = undefined infowindow.js

时间:2016-05-10 12:18:59

标签: javascript google-maps google-maps-api-3

我有一个奇怪的问题。它在infowindow.js中说f = undefined。但我甚至没有文件infowindow.js ......当我点击它时会发生这种情况。它必须显示infowindow,但它没有。

从此处获取文档中的代码:LINK

此处我的代码(地址数组现已调整,在我的代码中有普通地址):

function initMap() {
    var map = new google.maps.Map(document.getElementById('map'), {
        zoom: 7,
        center: { lat: 52.3, lng: 5.7 }
    });
    var geocoder = new google.maps.Geocoder();

    var addresses = [
        {
            'adres': 'teststraat 21',
            'plaats': 'Apeldoorn',
            'postcode': '1234AB',
            'telefoon': '0123456789',
            'openingstijden': 'test'
        },
        {
            'adres': 'teststraat 21',
            'plaats': 'Apeldoorn',
            'postcode': '1234AB',
            'telefoon': '0123456789',
            'openingstijden': 'test'
        },
        {
            'adres': 'teststraat 21',
            'plaats': 'Apeldoorn',
            'postcode': '1234AB',
            'telefoon': '0123456789',
            'openingstijden': 'test'
        },
    ];

    geocodeAddress(geocoder, map, addresses);
}

function geocodeAddress(geocoder, resultsMap, addresses) {
    for(var i = 0; i < addresses.length; i++) {
        geocoder.geocode({'address': addresses[i]['adres'] + addresses[i]['plaats']}, function (results, status) {
            if (status === google.maps.GeocoderStatus.OK) {
                var counter = i - addresses.length;
                var infowindow = new google.maps.InfoWindow({
                    content: 'test',
                    maxWidth: 200
                });
                var marker = new google.maps.Marker({
                    map: resultsMap,
                    position: results[0].geometry.location,
                    title: 'testadres ' + addresses[counter]['plaats'],
                });
                marker.addListener('click', function() {
                    infowindow.open(map, marker);
                });
                i++;
            } else {
                alert('Geocode was not successful for the following reason: ' + status);
            }
        });
    }
}

1 个答案:

答案 0 :(得分:1)

您在此段代码中使用map代替resultsMap

map对象在此上下文中不存在。应该是:

infowindow.open(resultsMap, marker);

要在开启新infowindow之前关闭,只需添加一个infowindow个实例,并在标记点击时更改其内容和位置:

&#13;
&#13;
var infowindow = null;
function initMap() {
    var map = new google.maps.Map(document.getElementById('map'), {
        zoom: 7,
        center: { lat: 52.3, lng: 5.7 }
    });
    var geocoder = new google.maps.Geocoder();

    var addresses = [];

    geocodeAddress(geocoder, map, addresses);
}

function geocodeAddress(geocoder, resultsMap, addresses) {
    var infowindow = new google.maps.InfoWindow();
    for(var i = 0; i < addresses.length; i++) {
        geocoder.geocode({'address': addresses[i]['adres'] + " " + addresses[i]['plaats']}, function (results, status) {
            if (status === google.maps.GeocoderStatus.OK) {
                var counter = i - addresses.length;
                var marker = new google.maps.Marker({
                    map: resultsMap,
                    position: results[0].geometry.location,
                    title: 'testadres ' + addresses[counter]['plaats'],
                });
                marker.addListener('click', function() {
                    infowindow.setContent('test content');
                    infowindow.open(resultsMap, marker);
                });
                i++;
            } else {
                alert('Geocode was not successful for the following reason: ' + status);
            }
        });
    }
}
&#13;
<div id="map" style="height:400px; width:500px;"></div>
<script src="https://maps.googleapis.com/maps/api/js?callback=initMap"
    async defer></script>
&#13;
&#13;
&#13;