未捕获的ReferenceError:谷歌未定义:41

时间:2014-01-21 19:42:46

标签: android google-maps-api-3 cordova

新手机屏幕并在我第一次尝试遇到问题。这在线工作,无法在模拟器上启动地理定位(或其他东西),并在上传到我的设备时给出“未捕获的ReferenceError:google未定义:41”错误。

我唯一能想到的是它没有加载地图js文件,或者某些订单没有正确构建。我见过的所有示例和项目都可以方便地跳过实际的设备测试。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>asd</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link href="css/codiqa.ext.min.css" rel="stylesheet">
<link href="css/jquery.mobile-1.3.1.min.css" rel="stylesheet">  
<script src="js/jquery-1.9.1.min.js"></script>
<script src="js/jquery.mobile-1.3.1.min.js"></script>
<script src="js/codiqa.ext.min.js"></script>
<script src="cordova.js"></script>
<script type="text/javascript" 
    src="https://maps.googleapis.com/maps/api/js?key=MYKEY0&sensor=true">
    </script>  
<style>
    html{height:100%;}
    body{height:100%; margin:0; padding:0;}
    #map-canvas{height:50%;}
    #content {
        padding:0;
        position:absolute !important;
        top:40px !important;
        right:0;
        bottom:40px !important;
        left:0 !important;
        z-index:10;
    }
  #bottom {margin-top:65%;}
</style>
<script type="text/javascript">
    $(document).on('pageinit', '#page1', function(e,data) { getPos(); });
    var lat;
    var lng;

    function getPos(){ navigator.geolocation.getCurrentPosition(onSuccess, onError); }

    function initializeMap() {
        console.log('init: '+lat+':'+lng);
        var myLatlng = new google.maps.LatLng(lat,lng);
        var mapOptions = {
            zoom:8,
            center:myLatlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        var map = new google.maps.Map(document.getElementById('map-canvas'),mapOptions);
    }

    function onSuccess(position){
        lat = position.coords.latitude;
        lng = position.coords.longitude;
        console.log(lat+":"+lng);
        initializeMap();
    }

    function onError(error){ 
        alert('code: ' + error.code + '\n' + 'message: ' + error.message + '\n');
    }
</script>
</head>
<body>
<div id="page1" data-role="page" data-theme="a">
    <div data-theme="a" data-role="header"> 
        <h3>MapIt</h3>
        <a data-rel="back">Back</a>
    </div>     
    <div data-role="content" id="content">   
        <div id="map-canvas"></div> 
    </div>
    <div id="bottom">
        <a href="#" class="add-markers" data-role="button" data-theme="a">AddMarkers</a>       
        <div data-controltype="textinput">
            <input name="" id="textinput2" placeholder="City and state" value="" type="text">
        </div>
        <input type="submit" value="Submit">
        <input type="submit" value="My Location">
    </div>     
</div>
</body>
</html>

我已经尝试了我在这里和网络上看到的所有解决方案。令人惊讶的是,只有一页半的谷歌搜索结果具有此标题和phonegap。 在我的手机上显示除了地图之外的所有内容。 正是这条线失败了

var myLatlng = new google.maps.LatLng(lat,lng);

提前致谢。

****UPDATE SOLVED****

这是白名单 其中有两个需要更改为

  1. in assets / www / config.xml
  2. 在res / xml / config.xml
  3. 我更改了index.html文件旁边的那个,并且不知道res / xml中有另一个。在index.html文件上方有一个我查看的res文件夹,但没有看到xml文件夹。

    希望这一点信息可以帮助别人

1 个答案:

答案 0 :(得分:0)

这是白名单有两个需要更改为

<access origin="*" />

1.in /assets/www/config.xml

2.in /res/xml/config.xml

我更改了index.html文件旁边的那个,并且不知道res / xml中有另一个。在index.html文件上方有一个我查看的res文件夹,但没有看到xml文件夹。

希望这一点信息可以帮助别人