2014-10-10 3 views
0

사용자의 현재 위치를 표시하고 Google지도에서 (폴리 라인으로) KMZ 파일을로드하는 데 필요한 Android 애플리케이션 (Phonegap으로 빌드)을 개발 중입니다. Google지도 api 사용).안드로이드 4.2.2 내 응용 프로그램에 대한 Google지도를로드하지 않습니다

내 응용 프로그램은 특정 확대/축소 수준 (11)으로지도를로드하고지도는 사용자의 현재 위치에 따라 가운데에 배치됩니다 (데이터 소비 감소). 나는 안드로이드 OS 4.2.2지도가 전혀로드되지 않았 음을 알리는 메시지가 "현재 위치에 대한 액세스가 거부되었습니다"라는 메시지를 보았습니다.

반면에 안드로이드 OS 4.1.2, 4.3, 4.4 (아무 메시지도받지 못함)에 대해 맵이 올바르게로드됩니다.

이것은 안드로이드 4.2.2의 보안 문제/버그입니까? 또는 APK를 빌드하는 데 사용하는 PhoneGap과 관련된 버그입니까?
이 문제를 어떻게 해결할 수 있습니까? 모바일 환경에서 필요한 설정이 있습니까?

감사합니다.

+0

Google API를 어떻게 호출하는지 코드를 공유 할 수 있습니까? – AAhad

+0

src = "https://maps.googleapis.com/maps/api/js?libraries=geometry&sensor=false&language=el&key= < MY API KEY> – Thanos

+0

감사합니다.지도를 호출하는 HTML 코드 조각과 JS 코드를보고 싶었습니다. – AAhad

답변

0

Android 4.2.2 또는 다른 지원되는 버전에서 제대로 작동합니다. 코드 설정에 실수가있을 수 있습니다.

샘플 앱을 만들어서 다시 확인했습니다.

단계 :

(1) 구글 API 키 및지도 JS는 HTML 헤더 섹션에을 링크 포함

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8" /> 
     <meta name="format-detection" content="telephone=no" /> 
     <meta name="msapplication-tap-highlight" content="no" /> 
     <meta name="viewport" content="width=device-width, height=device-height" /> 
     <link rel="stylesheet" type="text/css" href="css/index.css" /> 
     <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_VALUE_&sensor=true"></script> 
     <title>Hello World</title> 
    </head> 
    <body> 
      <b>Road View</b> 
      <div id="map-canvas" style="width: 100%; height: 200px"></div> 
      <b>Street View</b>   
      <div id="pano" style="width: 100%; height: 200px;"></div> 
      <b>Live Traffic Update View</b> 
      <div id="traffic" style="width: 100%; height: 200px;"></div> 

     <script type="text/javascript" src="cordova.js"></script> 
     <script type="text/javascript" src="js/index.js"></script> 
    </body> 
</html> 

(2) 하는 index.js에서 파일에서 다음 함수를 선언하여지도를 렌더링합니다.

var app = { 
     initialize: function() { 
      this.bindEvents(); 
     }, 
     bindEvents: function() { 
      document.addEventListener('deviceready', this.onDeviceReady, false); 
     }, 
     onDeviceReady: function() { 
      app.receivedEvent('deviceready'); 
      app.renderMap(); 
     }, 
     receivedEvent: function(id) { 
     }, 
     renderMap: function() { 
      // --- Road View 
      var fenway = new google.maps.LatLng(42.345573, -71.098326); 
      var mapOptions = { 
       center: fenway, zoom: 11 
      }; 
      var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 

      // ---- Street View 
      var panoramaOptions = { 
       position: fenway, 
       pov: { heading: 34, pitch: 10 } 
      }; 
      var panorama = new google.maps.StreetViewPanorama(document.getElementById('pano'), panoramaOptions); 
      map.setStreetView(panorama); 

      // ---- Live Traffic View 
      var myLatlng = new google.maps.LatLng(34.04924594193164, -118.24104309082031); 
      var mapOptions = { 
       zoom: 13, 
       center: myLatlng 
      } 
      var map = new google.maps.Map(document.getElementById('traffic'), mapOptions); 
      var trafficLayer = new google.maps.TrafficLayer(); 
      trafficLayer.setMap(map); 
     } 
    }; 

    app.initialize(); 

(3) AndroidManifest.xml 파일에 권한을 추가하십시오.

(4) 장치, 예를 들어, 원하는 버전 4.2.2 (5) 실행 응용 프로그램을 프로젝트 API 레벨을 설정하고지도보기의 세 가지 유형 (도로를 표시해야합니다, 거리와 실시간 교통)

enter image description here

enter image description here

+0

어떻게 든 AndroidManifest.xml 권한을 결과 창에 표시하지 않습니다. ( <사용 권한 android : name ="android.permission.ACCESS_FINE_LOCATION "/> <사용 권한 android : 이름 ="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS "/> <사용 권한 android : 이름 =" android.permission.INTERNET "/> – AAhad

0

이것은 JS 파일 코드 I입니다 지도에 KML 파일을로드하고 현재 위치를 가져 와서 마커를 표시하는 데 사용합니다.

'use strict'; 

angular.module('ehunter.controllers', []). 
    controller('RegionListCtrl', ['$scope', '$http', '$window', 
     function($scope, $http, $window) { 
      $http.get('regions.json').success(function(data) { 
       $scope.regions = data; 
      }); 
      $scope.openBrowser = function(url){ 
      $window.open(url, "_blank", "location=yes"); 

     } 
    }]) 
    .controller('RegionViewCtrl', ['$scope', '$routeParams', 
     function($scope, $routeParams) { 
      $scope.region = angular.fromJson($routeParams.r); 
      var map; 
      var src = "MY_SERVER"+ $scope.region.File; 

      initialize(); 


      function initialize() { 
       map = new google.maps.Map(document.getElementById('map_canvas'), { 
        zoom: 11, 
        mapTypeId: google.maps.MapTypeId.TERRAIN 
       }); 
       loadKmlLayer(src, map); 

      } 

      function loadKmlLayer(src, map) { 
       var kmlLayer = new google.maps.KmlLayer(src, { 
        suppressInfoWindows: true, 
        preserveViewport: true, 
        map: map 
       }); 

      } 

      getLocation(); 

      function getLocation(){ 
        if (navigator.geolocation) { 
        navigator.geolocation.getCurrentPosition(function displayPosition(position) { 

          var marker = new google.maps.Marker({ 
          position: new google.maps.LatLng(position.coords.latitude, position.coords.longitude), 
           map: map 
          }); 
         marker.setVisible(true); 
         marker.setMap(map); 
         map.setCenter(marker.position); 

         }); 

    }} 
    }]) 
관련 문제