2016-08-09 11 views
0

Ich bin neu in der ionischen Plattform. Ich versuche, Google Karte in meiner app zu implementieren. Karte wird angezeigt, wenn ich im Browser teste, aber wenn es auf einem echten Gerät auf Android läuft, wird nur weißer Bildschirm angezeigt. Ich habe verschiedene Dinge ausprobiert, wie in verschiedenen Threads empfohlen. Ich habe Änderungen in der Konfigurationsdatei angelegt, wie in untenstehenden Link erwähntGoogle Karte wird im Browser angezeigt, aber nicht im realen Gerät Android

https://github.com/driftyco/ionic-starter-maps/issues/10

aber kein Glück und haben Änderungen angewendet unter Verwendung unterschiedlicher Anzahl von Meta-Tags einzeln als in anderen Threads beschreibt aber kein Glück. In der Konsole kann ich den Fehler als 'Uncaught ReferenceError: google ist nicht definiert' sehen. Dazu habe ich anderen Thread versucht, wie unten

Uncaught ReferenceError: google is not defined

aber noch immer den gleichen Fehler erwähnt. Ich bin diesen Fehler nicht in der Lage zu Abbildung out.What andere, was ich unten bin fehlt, ist der Code, den ich in meiner app.Index Seite Code verwendet bin Sharing ist

enter image description here

Dies ist mein Controller-Code

.controller('MapCtrl', function($scope, $ionicLoading) { 
google.maps.event.addDomListener(window, 'load', function() { 
     var myLatlng = new google.maps.LatLng(37.3000, -120.4833); 

     var mapOptions = { 
      center: myLatlng, 
      zoom: 16, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 

     var myDiv=document.getElementById("map"); 
     var map = new google.maps.Map(myDiv, mapOptions); 
    }); 
}) 

und unten sind die Zeilen, die ich in der Konfigurationsdatei hinzugefügt haben, wie in verschiedenen Threads empfohlen

<access origin="*"/> 
<access origin="http://maps.google.com"/> 
<access origin="https://maps.google.com"/> 
<access origin="http://*.googleapis.com"/> 
<access origin="https://*.googleapis.com"/> 

Jede Hilfe

+0

Für das nächste Mal bitte den Code wie für den Controller zur Verfügung stellen. Ein Screenshot ist nicht einfach zu sehen/zu debuggen und kopieren/einfügen. – e666

Antwort

1

Es scheint, dass Sie Google Maps nicht gut in die Datei index.html importiert haben.

Das Problem ist die Zeile: <script src="//maps.google.com/maps/api/..."></script>

Auf einem Browser laden sie dieses Skript: http://maps.google.com/maps/api/... da Sie die Datei über http dienen.

Aber auf einem Gerät, werden Sie die Datei über file:// dienen so wird es versuchen, dieses Skript zu laden: file://maps.google.com/maps/api/... , die nicht verfügbar ist.

So müssen Sie https wie folgt angeben:

<script src="https://maps.google.com/maps/api/..."></script>

Verwandte Themen