在WP中,Google地图错误initMap不是一个函数

时间:2017-04-30 作者:user2141419

在一些Goole maps JS上获取一系列错误,这将显示json文件中的一系列标记以及列表。地图会出现,并在所有标记和信息窗口打开时工作,但列表不会打开标记。我在WordPress中也遇到了一系列错误。我使用enque调用函数文件y=中的google map api。在纯html中,页面工作正常,没有错误。

我遇到的第一个错误是:

“initMap不是函数”名称:“InvalidValueError”堆栈:“Error”↵ 在新kc(https://maps.googleapis.com/maps/api/js?key=MY-API-KEYk&callback=initMap&ver=4.7.4:47:499)↵ at对象。\\u。信用证proto:错误

    <script type="text/javascript">
        var map;
        var arrMarkers = [];
        var arrInfoWindows = [];

        function mapInit(){
            var centerCoord = new google.maps.LatLng(48.058249, -122.288615);
            var mapOptions = {
                zoom: 12,
                center: centerCoord,
                mapTypeId: google.maps.MapTypeId.TERRAIN
            };
            map = new google.maps.Map(document.getElementById("map"), mapOptions);
            $.getJSON("/wp-content/themes/the-language-of-puget-sound/js/map12.json", {}, function(data){
                $.each(data.places, function(i, item){
                $("#markers").append(\'<li><a href="#" rel="\' + i + \'">\' + item.English_Name + \'</a></li>\');
                var image = \'/wp-content/themes/the-language-of-puget-sound/js/Marker5-50.png\';
                var marker = new google.maps.Marker({
                     position: new google.maps.LatLng(item.Y_DD, item.X_DD),
                     map: map,
                     icon: image,
                     title: item.English_Name
                     });
                     arrMarkers[i] = marker;
                     var infowindow = new google.maps.InfoWindow({
                        content: "<span style=\'font-family: 
                        LushootseedSulad; font-size: large;\'>"+ item.Lushootseed +"</span><br><b>English Name: "+ item.English_Name +"</b><br>Meaning: "+ item.Meaning +"<br><img src="+ item.image +"><br>"+ item.Description +"<br><span style=\'font-family: LushootseedSulad; font-size: medium;\'>"+ item.Lushootseed +"</span><br><audio controls=\'true\' preload=\'none\' style=\'width:200px\'><br><source src=\'/wp-content/uploads/places/"+ item.audio +"\'\' type=\'audio/mpeg\'/>", border: 4, maxWidth: 250,
            });
            arrInfoWindows[i] = infowindow;
            google.maps.event.addListener(marker, \'click\', function() {
            var i = $(this).attr("rel");
            // this next line closes all open infowindows before opening the selected one
            for(x=0; x < arrInfoWindows.length; x++){ arrInfoWindows[x].close(); }  
            infowindow.open(map, marker);
                    });
               });
           });
        }
        $(function(){
        // initialize map (create markers, infowindows and list)
    mapInit();

        // "live" bind click event
        $("#markers a").live("click", function(){
             var i = $(this).attr("rel");
        // this next line closes all open infowindows before opening the selected one
        for(x=0; x < arrInfoWindows.length; x++){ arrInfoWindows[x].close(); 
    }
    arrInfoWindows[i].open(map, arrMarkers[i]);
            });
        });
    </script>

1 个回复
最合适的回答,由SO网友:s t 整理而成

地图。googleapis。com/maps/api/js?key=我的API密钥;callback=initMap&;版本=4.7.4:47:499

此api请求需要现有回调。重命名函数mapInitinitMap 它会工作的(除非你的函数无效)。

相关推荐

Read_Private_Pages功能不适用于新角色

我已经创建了一个新的用户角色-供应商-能够read_private_pages, 但当我以这样的用户身份登录并转到一个私人页面时,我看不到它。以下是我的插件代码:function fc_add_role($role, $display_name, $capabilities = array()) { if (!empty($role)) { return wp_roles()->add_role( $role, $display_name, $capabili