Question

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

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将代码划分为多个段。）

Answer 1

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

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

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

Answer 2

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

未捕获的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>

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

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

2 个答案: