使用cordova-plugin-google地图显示空白屏幕Ionic Framework [英] Displaying Blank screen by using cordova-plugin-google maps Ionic Framework
本文介绍了使用cordova-plugin-google地图显示空白屏幕Ionic Framework的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我按照 cordova google maps plugin
为Android设备生成的有效google地图API密钥
这是我工作的代码...
< html>
< head>
< meta charset =utf-8/>
< meta name =viewportcontent =width = device-width，initial-scale = 1>
< script type =text / javascriptsrc =cordova.js>< / script>
< script type =text / javascript>
var map;
document.addEventListener（deviceready，function（）{
var div = document.getElementById（map_canvas）;
//初始化地图视图
map = plugin.google.maps.Map.getMap（div）;
//等到地图准备就绪状态
map.addEventListener（plugin.google.maps.event.MAP_READY ，onMapReady）;
}，false）;
function onMapReady（）{
var button = document.getElementById（button）;
button.addEventListener（click，onBtnClicked，false）;
}
function onBtnClicked（）{
map.showDialog（）;
}
< / script>
< / head>
< body>
< h3> PhoneGap-GoogleMaps-Plugin< / h3>
< div style =width：100％; height：400pxid =map_canvas>< / div>
< button id =button>全屏< / button>
< / body>
< / html>
请帮助任何人。
解决方案
问题是你的API密钥。
https://developers.google.com/maps/documentation/ android-api / signup
am new to using cordova google maps in my ionic app.when used this plugin in my app am getting blank screen like
I followed step by step as mentioned in cordova google maps plugin
Generated valid google maps API key for Android device
this is the code i worked on it...
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript">
var map;
document.addEventListener("deviceready", function() {
var div = document.getElementById("map_canvas");
// Initialize the map view
map = plugin.google.maps.Map.getMap(div);
// Wait until the map is ready status.
map.addEventListener(plugin.google.maps.event.MAP_READY, onMapReady);
}, false);
function onMapReady() {
var button = document.getElementById("button");
button.addEventListener("click", onBtnClicked, false);
}
function onBtnClicked() {
map.showDialog();
}
</script>
</head>
<body>
<h3>PhoneGap-GoogleMaps-Plugin</h3>
<div style="width:100%;height:400px" id="map_canvas"></div>
<button id="button">Full Screen</button>
</body>
</html>
please help me anyone.
解决方案
The problem is with you API key. https://developers.google.com/maps/documentation/android-api/signup
这篇关于使用cordova-plugin-google地图显示空白屏幕Ionic Framework的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
