Question

我试图在我的APP中显示地图，但我没有定义＆＃34; google未定义＆＃34;

我的index.js看起来像这样：

$(document).on('click', '#home_button', (function () {

        var coords = new google.maps.LatLng(-17.391919993615, -66.155978093418);
        var opciones = { center: coords, zoom: 15, mapTypeId: google.maps.MapTypeId.ROADMAP };
        var mapa = new google.maps.Map(document.getElementById("map"), opciones);
        var marcador = new google.maps.Marker({
            position: coords,
            map: mapa,
            animation: google.maps.Animation.DROP

        })


        getRefresh();
    }));

我的index.html标题如下：

<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
    <access origin="*" />
    <meta name="format-detection" content="telephone=no">
    <meta name="msapplication-tap-highlight" content="no">
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
    <link rel="stylesheet" href="css/jquery.mobile-1.4.5.min.css" />
    <link rel="stylesheet" type="text/css" href="css/index.css">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">        
    <script src="../../Jquery/prettify.js"></script>
    <script type="text/javascript" src="cordova.js"></script>
    <script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDGGvPKPbRdqHqS98CK8BShmF7VLBHepcQ&sensor=false"></script>

之后我只是在<div id="map">

中显示它

Answer 1

这适用于所有平台。之所以发生这种情况，是因为尚未加载Google API库，而且已经调用了它。按照此SO thread中的建议异步加载。确保在使用googleapis for maps之前先加载它：

<body>
    <div id="floating-panel">
        <input id="address" type="textbox" value="Sydney, NSW">
        <input id="submit" type="button" value="Geocode">
    </div>
    <div id="map"></div>
    <script>
        function initMap() {
            var map = new google.maps.Map(document.getElementById('map'), {
            zoom: 8,
            center: {lat: -34.397, lng: 150.644}
            });

            });
        }
    </script>
    //load it first using async
    <script async defer
    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB8X7wnW7veRvTnS1xGzuxDaIGuQlHMn8I&callback=initMap">
    </script>
</body>

----另一个样本------

//load googleapis for maps first
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
//your js file that will use it
<script type ="text/javascript" src ="SomeJScriptfile.js"></script>

不

<script type ="text/javascript" src ="SomeJScriptfile.js"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>

得到＆＃34;谷歌未定义＆＃34;在apache cordova

1 个答案: