我是 Cordova 的初学者。
我在显示谷歌地图时遇到问题。
我可以使用 javascript 在网站中显示谷歌地图。
我还可以使用 java 和 xcode 显示谷歌地图。
但不确定如何显示使用 Cordova 。因为它是javascript + html。
所以我可以像下面的代码一样编写代码。
<!DOCTYPE html>
<html>
<head>
<title>Simple Map</title>
<meta name="viewport" content="initial-scale=1.0">
<meta charset="utf-8">
<style>
/* Always set the map height explicitly to define the size of the div
* element that contains the map. */
#map {
height: 100%;
}
/* Optional: Makes the sample page fill the window. */
html, body {
height: 100%;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 8
});
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"
async defer></script>
</body>
</html>
当然,它在网络浏览器上运行良好。我的问题是我应该使用什么样的 key ?
我第一次使用 javascript 键。但它在ios和android上不起作用。我想在 android 上运行我应该使用 andorid key 。但如果是的话我怎样才能得到sha足迹 key 。 ios 上也是同样的情况。没有这个我无法获得 android google map api key 。我正在尝试找到解决方案,但是有很多视频和文档,如果我使用 javascript api key ,它效果很好。但事实并非如此。我相信。如果是的话我们怎样才能拿到 key ?其次,是否正确地将 android 和 ios key 插入到 javascript 代码中?
请帮助我。谢谢。
最佳答案
My question is that what kind of key I should use?
无论应用所在的设备如何,您都应该使用正确的 API key 。
如果您前往Google Developer Console ,如果您还没有一次性 > 凭据 > 创建凭据并选择 API key ,请创建一个帐户。 创建您需要的任何一个,Android、iOS 等。
Loading the script
您确实应该检查用户的互联网连接以在应用程序中加载外部脚本 heres a tutorial for that .
基本上使用cordova-plugin-network-information检查用户连接状态,如果已连接则加载 map 脚本。
(function (global) {
"use strict";
function onDeviceReady () {
document.addEventListener("online", onOnline, false);
document.addEventListener("resume", onResume, false);
loadMapsApi();
}
function onOnline () {
loadMapsApi();
}
function onResume () {
loadMapsApi();
}
function loadMapsApi () {
var API_KEY;
if ( device.platform === 'Android') {
API_KEY = 'youAndroidAPIkey';
} else if ( device.platform === 'iOS') {
API_KEY = 'youriOSAPIkey';
}
if(navigator.connection.type === Connection.NONE || google.maps) {
return;
}
$.getScript('https://maps.googleapis.com/maps/api/js?key='+API_KEY+'&sensor=true&callback=onMapsApiLoaded');
}
global.onMapsApiLoaded = function () {
// Maps API loaded and ready to be used.
var map = new google.maps.Map(document.getElementById("map"), {});
};
document.addEventListener("deviceready", onDeviceReady, false);
})(window);
编辑-------------
我原来用的是cordova-google-maps恕我直言,它对我来说太臃肿和有缺陷,无法在商业应用程序中使用。
关于javascript - 如何获取 Cordova 的谷歌地图API key ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40668376/