2

即使我允许所有外部主机，Google Maps API v3 也无法在移动浏览器或 PhoneGap 中运行

我尝试使用或不使用 apikey。

loadMapScript()当设备准备好（在 iDevice(iOS) 上）或加载页面时（在计算机上）调用该方法

当我导航到有地图的页面时，我收到消息，这"Error Loading map"意味着mapnull

我怀疑谷歌检测到我正在使用 iOS 设备并限制我使用他们的 API，但我没有证据。

PS这适用于所有浏览器！PS 我在 iPad 的 safari 中尝试过，但它不起作用！但在电脑上工作！PS刚刚检查它不适用于任何移动浏览器或phonegap，但适用于所有桌面浏览器：/

任何帮助，将不胜感激

编码：

function loadMapScript() {
    if($("#googleMaps").length == 0) {
        var script = document.createElement("script");
        script.type = "text/javascript";
        script.id = "googleMaps"
        script.src = "http://maps.googleapis.com/maps/api/js?sensor=false&callback=initializeMap&key=HIDDEN";
        document.body.appendChild(script);
    } else console.log("Error, googleMaps already loaded");
}



function initializeMap(mapOptions) {
    console.log("Init Maps");
    var myLatlng = new google.maps.LatLng(currentLocation.coords.latitude, currentLocation.coords.longitude);
    if(!mapOptions)
        mapOptions = {
            center: myLatlng,
            zoom: 18,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
    if(!map)
        map = new google.maps.Map(document.getElementById("map_canvas"),
            mapOptions);
    else {
        map.setOptions(mapOptions);
    }
    updateCurrentLocationMarker();
}



function updateCurrentLocationMarker() {
    if(!map) {
        return;
    }
    var myLatlng = new google.maps.LatLng(currentLocation.coords.latitude,
        currentLocation.coords.longitude);
    if(currentLocationMarker) {
        currentLocationMarker.setMap(null);
    } else {
        currentLocationMarker = new google.maps.Marker({
            position: myLatlng,
            animation: google.maps.Animation.DROP,
            title:"You!"
        });
        currentLocationMarker.setMap(map);
    }
}

function onMapsShow() {
    if(!map) {
        showToastNow("Error Loading map");
        return;
    }
}
4

1 回答 1

2

这段代码怎么样？我根据您的代码创建了代码。我尝试了我的 iPad，并且成功了。

var map, mapOptions, currentLocation, currentLocationMarker;
function loadMapScript() {
  var script = document.createElement("script");
  script.type = "text/javascript";
  script.id = "googleMaps"
  script.src = "https://maps.googleapis.com/maps/api/js?sensor=false&callback=initializeMap";
  document.body.appendChild(script);
}

function initializeMap(mapOptions) {
  var myLatlng = new google.maps.LatLng(currentLocation.coords.latitude, currentLocation.coords.longitude);
  var mapOptions = {
    center : myLatlng,
    zoom : 18,
    mapTypeId : google.maps.MapTypeId.ROADMAP
  };
  map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

  updateCurrentLocationMarker();
}

function updateCurrentLocationMarker() {
  var myLatlng = new google.maps.LatLng(currentLocation.coords.latitude, currentLocation.coords.longitude);

  if (currentLocationMarker) {
    currentLocationMarker.setMap(null);
  } else {
    currentLocationMarker = new google.maps.Marker({
      position : myLatlng,
      animation : google.maps.Animation.DROP,
      title : "You!",
      map : map
    });
  }
}

function onSuccess(position) {
  currentLocation = position;
  if (!map) {
    loadMapScript();
  }
}

function onError(error) {
  alert('code: ' + error.code + '\n' + 'message: ' + error.message + '\n');
}

function onDeviceReady() {
  navigator.geolocation.getCurrentPosition(onSuccess, onError);
}

document.addEventListener("deviceready", onDeviceReady, false);
于 2012-11-10T09:22:22.730 回答