javascript - Google Maps API : markerwithlabel. js - 未捕获的 ReferenceError:未定义谷歌

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

我已经阅读了文档和示例,但我似乎无法在尝试包含 markerwithlabel.js 文件和 这让我想起了“你不能在 map 完成之前加载某些东西”的问题。

我能做什么?

尝试了什么:

<head>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=mykey&callback=initMap"></script>
<script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerwithlabel/src/markerwithlabel.js"></script>
<script type="text/javascript"> 
    var map;
    function initMap() {

            map = new google.maps.Map(document.getElementById('map'), {
                zoom: 14,
                center: {lat: 52.5200066, lng: 13.404954}
            });

            var marker1 = new MarkerWithLabel({
                   position: homeLatLng,
                   draggable: true,
                   raiseOnDrag: true,
                   map: map,
                   labelContent: "$425K",
                   labelAnchor: new google.maps.Point(22, 0),
                   labelClass: "labels", // the CSS class for the label
                   labelStyle: {opacity: 0.75}
            });
    }
</script>

..

最佳答案

markerwithlabel.js 需要一个已经加载的 map API。

当您异步加载 maps-API(如您在代码中所做的那样)时,无法保证在加载 markerwithlabel.js 时加载 maps-API。

解决方案:同步加载 map API

<script src="https://maps.googleapis.com/maps/api/js?v=3&key=mykey"></script>
<script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerwithlabel/src/markerwithlabel.js"></script>
<script type="text/javascript"> 
    var map;
    function initMap() {

            map = new google.maps.Map(document.getElementById('map'), {
                zoom: 14,
                center: {lat: 52.5200066, lng: 13.404954}
            });

            var marker1 = new MarkerWithLabel({
                   position: homeLatLng,
                   draggable: true,
                   raiseOnDrag: true,
                   map: map,
                   labelContent: "$425K",
                   labelAnchor: new google.maps.Point(22, 0),
                   labelClass: "labels", // the CSS class for the label
                   labelStyle: {opacity: 0.75}
            });
    }
google.maps.event.addDomListener(window, 'load', initMap);
</script>

关于javascript - Google Maps API : markerwithlabel. js - 未捕获的 ReferenceError:未定义谷歌,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32692791/

相关文章:

javascript - 如何从单个 react 组件调用多个 graphql 突变?

javascript - JavaScript 变量可以输入吗?

javascript - 向谷歌地图 API 添加点

android - 谷歌地图 "OVER_QUERY_LIMIT"

javascript - 从宽度 : 100%; to width: 1000 px; when <1000px (Javascript) 更改 div

javascript/children-检查图像的 alt 值

google-maps - 如何更改信息窗口背景颜色

javascript - 谷歌地图 API 和 Github 页面

php - 谷歌距离矩阵 JSON 最短路径 (PHP)

javascript - 是否可以使用 Google Place Search API 在 KML 图层内进行搜索?