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 레벨을 설정하고지도보기의 세 가지 유형 (도로를 표시해야합니다, 거리와 실시간 교통)
Google API를 어떻게 호출하는지 코드를 공유 할 수 있습니까? – AAhad
src = "https://maps.googleapis.com/maps/api/js?libraries=geometry&sensor=false&language=el&key= < MY API KEY> – Thanos
감사합니다.지도를 호출하는 HTML 코드 조각과 JS 코드를보고 싶었습니다. – AAhad