javascript - Google map API 不适用于 PhoneGap - 生成空白页

标签 javascript android cordova google-maps phonegap-build

我正在使用 Adob​​e phonegap 构建站点并尝试创建一个非常基本的单页 html 以利用 Google Maps API,不幸的是它不起作用。它只生成一个空白的白页。

我的索引 html...

  <!DOCTYPE html>
  <html style="height:100%">
  <head>
  <script src="lib/maps.js"></script>//I have copied the Google maps JS locally
  </script>

  <script>
      function initialize() {
           alert("Initialize called...");
           var mapProp = {
           center:new google.maps.LatLng(51.508742,-0.120850),
           zoom:5,
           mapTypeId:google.maps.MapTypeId.ROADMAP
       };
       alert("Map props loaded...");
       var map=new google.maps.Map(document.getElementById("googleMap"), mapProp);
       alert("The div innerHTML"+document.getElementById("googleMap").innerHTML);
     }
     google.maps.event.addDomListener(window, 'load', initialize);
  </script>
 </head>

 <body style="height: 100%; margin: 0; padding: 0">
   <div id="googleMap" style="height:200px;position:relative;"></div>
 </body>
 </html>

我的 phonegap config.xml...

 <?xml version="1.0" encoding="UTF-8"?>
 <widget xmlns       = "http://www.w3.org/ns/widgets"
    xmlns:gap   = "http://phonegap.com/ns/1.0"
    id          = "org.aninda.areyouclose"
    versionCode = "10"
    version     = "1.1.0">

<name>Test App</name>

<description>
    Test
</description>

<author href="http://www.aninda-bhattacharyya.com" email="aninda@gmail.com">
    Aninda Bhattacharyya
</author>

<feature name="http://api.phonegap.com/1.0/camera"/>
<feature name="http://api.phonegap.com/1.0/contacts"/>
<feature name="http://api.phonegap.com/1.0/file"/>
<feature name="http://api.phonegap.com/1.0/geolocation"/>
<feature name="http://api.phonegap.com/1.0/media"/>
<feature name="http://api.phonegap.com/1.0/network"/>
<feature name="http://api.phonegap.com/1.0/notification"/>

<icon src="icon.png" />
<icon src="icon.png" gap:platform="android" density="ldpi" />
<icon src="icon.png" gap:platform="android" density="mdpi" />
<icon src="icon.png" gap:platform="android" density="hdpi" />
<icon src="icon.png" gap:platform="android" density="xhdpi" />

<access origin="googleapis.com" subdomains="true"/>

</widget>

我现在已经敲了8个多小时的脑袋了。请帮忙!

最佳答案

想在弄清楚问题所在后回答我自己的问题。错过了在 config.xml 中包含 cordova 白名单插件。添加了以下行,瞧...

<gap:plugin name="com.indigoway.cordova.whitelist.whitelistplugin" version="1.1.1" />

关于javascript - Google map API 不适用于 PhoneGap - 生成空白页,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33702280/

相关文章:

javascript - 服务器端和特定时间的脚本执行

javascript - 如何将参数从一个函数发送到另一个函数

java - 在android中传输文件

Android colorControlNormal xml 属性在 Lollipop 之前不起作用

ios - 通过 iOS api 命令创建 phonegap 应用程序时出错

android - cordova 中所有平台的通用 www 文件夹和所有文件

javascript - jQuery:改变最高值

javascript - 如何正确迭代 JSON 对象?

android - 适用于 Intent 的所有附加功能的列表

angular - 无法在 ionic 3 项目的模块中导入 google plus 插件