谷歌地图:未捕获的ReferenceError:未定义谷歌

时间:2015-12-12 23:26:51

标签: javascript google-maps

我正在处理谷歌地图脚本,这会引发此错误。 问题出在这一行:

var map = new google.maps.Map(document.getElementById('google-map'), {

相应的Javascript文件是这样的:https://goo.gl/xS5912 相应的HTML代码段是:

<!-- Google Maps -->
    <div id="google-map"></div>

完整的HTML是:https://goo.gl/xHD2wL

问题的屏幕截图在这里:http://prntscr.com/9dgplc

该网站已在此处托管:https://goo.gl/8x76Ux

我发现很少有问题提出这个问题的解决方案,但我还没有真正了解其中的大多数问题:异步加载脚本或拥有开发人员API密钥。
我只是在寻找问题的解决方案,最好是解决问题的原因。

完整代码为here

编辑1: 缺少API的链接。我已经添加了,错误已经消失,但地图仍未显示。 (请注意,我已经使用PHP将代码划分为多个段。)

2 个答案:

答案 0 :(得分:2)

我无法看到您已将其与Google Maps API联系在一起?

您需要链接此脚本才能定义Google:

<script src="https://maps.googleapis.com/maps/api/js"></script>

答案 1 :(得分:1)

我运行了你的脚本,似乎以下错误很常见。

  

未捕获的TypeError:无法读取属性&#39; offsetWidth&#39;为null

我发现了这个问题: Google MAP API Uncaught TypeError: Cannot read property 'offsetWidth' of null的答案表明错误是因为在js脚本运行之前没有渲染地图div。

尝试:

<script>
/* Your location */
function initialize () {
    var locations = [
        ['IIIT Hyderabad, Gachibowli, Hyderabad <span>Head Office</span>', 17.444792, 78.348310, 1]
    ];

    /* Map initialize */
    var mapCanvas = document.getElementById('google-map');
    var mapOptions = {
        zoom: 10,
        center: new google.maps.LatLng(17.444792, 78.348310),
        panControl: false,
        zoomControl: true,
        scaleControl: false,
        mapTypeControl: false,
        mapTypeId: google.maps.MapTypeId.ROADMAP
        }
    var map = new google.maps.Map(mapCanvas, mapOptions);
    }

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

这只在页面加载后调用脚本。我跑了它,它适用于我。