使用 Phonegap Build 后谷歌地图不会在手机上显示答案

【问题标题】：Google maps wont display on mobile after using Phonegap Build使用 Phonegap Build 后谷歌地图不会在手机上显示
【发布时间】：2016-08-30 13:40:30
【问题描述】：

我的 Google 地图在 Firefox 中运行良好，但是当我为移动设备构建它时。该地图根本不显示或加载，遗憾的是我的编码经验和知识是zilch并且仍然没有找到解决方案......有没有人有任何关于问题的指针？如果需要，我可以发布更多代码

var map, places, iw;
var markers = [];
var autocomplete;
var defaultLatLng = new google.maps.LatLng(34.0983425, -118.3267434); 
var myLatlng = new google.maps.LatLng(37.783259, -122.402708);

function initialize() {
  var myOptions = {
    zoom: 17,
    //center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  if (navigator.geolocation) {
    browserSupportFlag = true;
    navigator.geolocation.getCurrentPosition(function(position) {
      initialLocation = new google.maps.LatLng(position.coords
        .latitude, position.coords.longitude);
      map.setCenter(initialLocation);
      map.setZoom(16);
      var marker = new google.maps.Marker({
        position: initialLocation,
        title: "You are here!"
      });
      marker.setMap(map);
    }, function() {
      handleNoGeolocation(browserSupportFlag);
    });
  }
  map = new google.maps.Map(document.getElementById("map_canvas"),
    myOptions);
  places = new google.maps.places.PlacesService(map);
  google.maps.event.addListener(map, 'tilesloaded', tilesLoaded);
  autocomplete = new google.maps.places.Autocomplete(document.getElementById(
    'autocomplete'));
  google.maps.event.addListener(autocomplete, 'place_changed', function() {
    showSelectedPlace();
  });
}

【问题讨论】：

听起来你好像没有在你的config.xml 文件中将它列入白名单。尝试将此添加到配置中...<access origin="*"/> 这将使您的应用程序可以访问外部资源。我建议将原始部分配置为更具体的内容。确保您也添加了 cordova 白名单插件，请参阅 Github 文档...github.com/apache/…

标签： javascript android google-maps phonegap-plugins phonegap-build

【解决方案1】：

你需要在初始化之前使用“插件”

即：plugin.google.maps.Map(document.getElementById("map_canvas");

其他初始化类似

var map, places, iw;
var markers = [];
var autocomplete;
var defaultLatLng = new plugin.google.maps.LatLng(34.0983425, -118.3267434); 
var myLatlng = new plugin.google.maps.LatLng(37.783259, -122.402708);

function initialize() {
  var myOptions = {
    zoom: 17,
    //center: myLatlng,
    mapTypeId: plugin.google.maps.MapTypeId.ROADMAP
  }
  if (navigator.geolocation) {
    browserSupportFlag = true;
    navigator.geolocation.getCurrentPosition(function(position) {
      initialLocation = new plugin.google.maps.LatLng(position.coords
        .latitude, position.coords.longitude);
      map.setCenter(initialLocation);
  map.setZoom(16);
  var marker = new plugin.google.maps.Marker({
    position: initialLocation,
    title: "You are here!"
  });
  marker.setMap(map);
}, function() {
  handleNoGeolocation(browserSupportFlag);
});
  }
  map = new google.maps.Map(document.getElementById("map_canvas"),
    myOptions);
  places = new google.maps.places.PlacesService(map);
  plugin.google.maps.event.addListener(map, 'tilesloaded', tilesLoaded);
  autocomplete = new         plugin.google.maps.places.Autocomplete(document.getElementById(
'autocomplete'));
  plugin.google.maps.event.addListener(autocomplete, 'place_changed', function() {
showSelectedPlace();
  });
}

【讨论】：

嗨tejas，我尝试在初始化之前添加“插件”，但是代码不再在我的浏览器中工作。我需要先安装插件吗？对不起，我不擅长这个：/ @TejasGhutukade

【解决方案2】：

至少

var defaultLatLng = new google.maps.LatLng(34.0983425, -118.3267434); var myLatlng = new google.maps.LatLng(37.783259, -122.402708);

应该放在initialize()中

中心：myLatlng

不应被注释掉

应该有以下css样式

html，正文 { 高度：100%； }

地图{
```
height: 100%;
```
}

【讨论】：

我尝试了第一步，但是地图完全停止在我的浏览器中加载，我取消了 myLatLng 的注释，但这并没有解决我的移动问题。我已经完成了第3步，关于可能是什么问题的任何其他想法？谢谢。

地图{