未捕获的参考错误:未定义谷歌

时间:2014-10-13 11:15:59

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

我看到了十几个同名的问题&问题。在经历了所有这些问题之后在代码中进行更改,我无法解决此问题。

我的Google地图工作正常。但是在控制台中,会显示此错误。任何人都可以帮我解决这个问题。

我在head标记

中指定了JavaScript代码
 <script>
    function loadScript()
    {
    var myKey = "__API-Key__";
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = "http://maps.googleapis.com/maps/api/js?key="+myKey+"&sensor=false&callback=initialize";
    document.body.appendChild(script);
    }
    window.onload = loadScript;
    </script>

    <script>

        function initialize()
        {
            var laa=-34.397;
            var lonn= 150.644;
            var mapOptions =
            {
                zoom: 7,
                center: new google.maps.LatLng(laa, lonn),
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                maxZoom: 8,
                minZoom:2
            };

            var map = new google.maps.Map(document.getElementById('location-canvas'),
                mapOptions);

            var marker = new google.maps.Marker({
                map: map,
                draggable: false,
                position: new google.maps.LatLng(laa, lonn)
            });

            function bind(eventName)
            {
                google.maps.event.addListener(map, eventName, function ()
                {
                    common();

                });
            }

            bind('zoom_changed');
            bind('center_changed');
            bind('tilesloaded');
            bind('idle');

            function common()
            {
                var bounds = map.getBounds();
                var southWest = bounds.getSouthWest();
                var northEast = bounds.getNorthEast();
                var getcentre=bounds.getCenter();
                var ne = map.getBounds().getNorthEast();
                var sw = map.getBounds().getSouthWest();
                var zoom=map.getZoom();
                var centre_lat=getcentre.lat();
                var centre_long=getcentre.lng();
                var myLatlng=new google.maps.LatLng(centre_lat,centre_long);
                var mapProp =
                {
                    center: new google.maps.LatLng(centre_lat,centre_long),
                    zoom:zoom,
                    maxZoom: 8,
                    minZoom:2,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };

            }
        }

        google.maps.event.addDomListener(window, 'resize', initialize);
        google.maps.event.addDomListener(window, 'load', initialize);

    </script>

Inside Body标签:

            <div id='location-canvas' style='width:100%;height:500px;'>

            </div>

1 个答案:

答案 0 :(得分:5)

您不需要包含两行,因为您已经使用http://maps.googleapis.com/maps/api/js?key="+myKey+"&sensor=false&callback=initialize

定义了一个回调函数

所以要么使用

<script src="http://maps.googleapis.com/maps/api/js?key="+__API-Key__+"&sensor=false" type="text/javascript"></script>

没有函数调用,直接将其放在文档

或删除

   google.maps.event.addDomListener(window, 'resize', initialize);
   google.maps.event.addDomListener(window, 'load', initialize);

e.g:

<script src="http://maps.googleapis.com/maps/api/js?key="+__API-Key__+"&sensor=false"></script>

<script>

    function initialize()
    {
        var laa=-34.397;
        var lonn= 150.644;
        var mapOptions =
        {
            zoom: 7,
            center: new google.maps.LatLng(laa, lonn),
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            maxZoom: 8,
            minZoom:2
        };

        var map = new google.maps.Map(document.getElementById('location-canvas'),
            mapOptions);

        var marker = new google.maps.Marker({
            map: map,
            draggable: false,
            position: new google.maps.LatLng(laa, lonn)
        });

        function bind(eventName)
        {
            google.maps.event.addListener(map, eventName, function ()
            {
                common();

            });
        }

        bind('zoom_changed');
        bind('center_changed');
        bind('tilesloaded');
        bind('idle');

        function common()
        {
            var bounds = map.getBounds();
            var southWest = bounds.getSouthWest();
            var northEast = bounds.getNorthEast();
            var getcentre=bounds.getCenter();
            var ne = map.getBounds().getNorthEast();
            var sw = map.getBounds().getSouthWest();
            var zoom=map.getZoom();
            var centre_lat=getcentre.lat();
            var centre_long=getcentre.lng();
            var myLatlng=new google.maps.LatLng(centre_lat,centre_long);
            var mapProp =
            {
                center: new google.maps.LatLng(centre_lat,centre_long),
                zoom:zoom,
                maxZoom: 8,
                minZoom:2,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };

        }
    }

    google.maps.event.addDomListener(window, 'resize', initialize);
    google.maps.event.addDomListener(window, 'load', initialize);
</script>

        <div id='location-canvas' style='width:100%;height:500px;'>

        </div>

这应该可以。