Google Map未在PHONEGAP ANDROID模拟器中显示

时间:2013-01-11 21:49:14

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

现在我已经看到了一些与此相关的主题,其中大部分都是因为宽度高度 但是我的代码中有这个。

<!DOCTYPE html>
<html>
<head>
    <title>MAP APPLICATION</title>
    <meta name="viewport" content="user-scalable=no,initial-scale=1, maximum-scale=1,minimum-scale=1, width=device-width;" />
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=----MY KEY---&sensor=true"></script>
    <script type="text/javascript" charset="utf-8" src="phonegap-1.9.0.js"></script>
    <script type="text/javascript" charset="utf-8">

    // Wait for PhoneGap to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);

    var watchID = null;

    // PhoneGap is ready
    //
    function onDeviceReady() {
        // Update every 3 seconds
        var options = { frequency: 3000, enableHighAccuracy: true };
        watchID = navigator.geolocation.watchPosition(onSuccess, onError, options);
    }



    // onSuccess Geolocation
    //
    function onSuccess(position) {
            var element = document.getElementById('geolocation');
            element.innerHTML = 'Latitude: '  + position.coords.latitude      + '<br />' +
                            'Longitude: ' + position.coords.longitude     + '<br />' +
                            '<hr />'      + element.innerHTML;

            var latLng   =  new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
            var mapOptions = {
                    center: latLng,
                    panControl: false,
                    zoomControl: true,
                    zoom: 16,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
             };
             var map = new google.maps.Map(document.getElementById('map_holder'),mapOptions);
             var marker = new google.maps.Marker({
                    position: latLng,
                    map: map
             });
    }                            


    // onError Callback receives a PositionError object
    //
    function onError(error) { 
        var errString = '';
        // Check to see if we have received an error code
        if(error.code) {
            // If we have, handle it by case
            switch(error.code)  {
                case 1: // PERMISSION_DENIED
                errString =
                'Unable to obtain the location information ' +
                'because the device does not have permission '+
                'to the use that service.';
                break;
                case 2: // POSITION_UNAVAILABLE
                errString =
                'Unable to obtain the location information ' +
                'because the device location could not be ' +
                'determined.';
                break;
                case 3: // TIMEOUT
                errString =
                'Unable to obtain the location within the ' +
                'specified time allocation.';
                break;
                default: // UNKOWN_ERROR
                errString =
                'Unable to obtain the location of the ' +
                'device due to an unknown error.';
                break;
            }
        }
        // Handle any errors we may face
        var element = document.getElementById('map_holder');
        element.innerHTML = errString;
    }

    </script>
  </head>
  <body>
    <p id="geolocation">Watching geolocation...</p>
    <button id="btnWatchPosition" onclick="onDeviceReady();">TOGGLE</button> <br>
    <div id="map_holder" width="100%" height="100%"></div>
  </body>
</html>

COORDINATES正在显示,在我按下TOGGLE按钮之后...但没有地图显示,我做错了。

1 个答案:

答案 0 :(得分:0)

删除此行,它将在Android Emulator(eclipse)中运行

<meta name="viewport" content="user-scalable=no,initial-scale=1, maximum-scale=1,minimum-scale=1, width=device-width;" />