2

すべての外部ホストを許可しても、モバイルブラウザまたはPhoneGapでGoogle MapsAPIv3が機能しない

apikeyを使用して、または使用せずに試しました。

このメソッドloadMapScript()は、デバイスの準備ができたとき（iDevice（iOS）の場合）、またはページがロードされたとき（コンピューターの場合）に呼び出されます。

地図のあるページに移動すると、次のようなメッセージが表示"Error Loading map"されます。mapnull

GoogleがiOSデバイスを使用していることを検出し、APIの使用を制限していると思われますが、その証拠はありません。

PSこれはすべてのブラウザで正常に機能します！PS iPad用のサファリでこれを試しましたが、機能しません！しかし、コンピューター上で動作します！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 に答える