2016-05-06 11 views
0

Ich lerne gerade Ionic und ich versuche, ein Kartenmodul in meinem Projekt zu erstellen, aber es zeigt nichts, wenn ich auf die Karten.html von der Seitenleiste klicke und ich denke, ich ' Probleme mit Bibliotheksproblemen haben. Irgendwelche Vorschläge würden sehr geschätzt werden.Google Map funktioniert nicht in Ionic Application

maps.js

<ion-view title="Maps" id="page4"> 
<ion-content overflow-scroll="true" padding="true" class="has-header" ng-controller="MapController"> 
<div id="map" data-tap-disabled="true"></div> 
</ion-content> 

index.html

<script src="http://maps.googleapis.com/maps/api/js?key=[mykeynumber]&sensor=true"></script> 

style.css

.scroll { 
    height: 100%; 
} 

#map { 
    width: 100%; 
    height: 100%; 
} 

app.js

foo.controller('MapController', 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 map = new google.maps.Map(document.getElementById("map"), mapOptions); 

    navigator.geolocation.getCurrentPosition(function(pos) { 
     map.setCenter(new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude)); 
     var myLocation = new google.maps.Marker({ 
      position: new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude), 
      map: map, 
      title: "My Location" 
     }); 
    }); 

    $scope.map = map; 
}); 


}); 

I'm getting a blank Map page

+0

https://market.ionic.io/plugins/locateme gehen durch diese – Maheshvirus

+0

Noch habe ich mein Problem nicht gelöst, weil ich die Karte in index.html sehen kann, aber ich möchte die Karte in map.html sehen. Ich habe nicht verstanden, warum ich so einen Fehler bekommen habe. – foo0507

+0

zeigen Sie Ihre app.js – Atula

Antwort

0

Versuchen Sie diesen Link an, seine Arbeit

<script src="http://maps.google.com/maps/api/js?sensor=false&language=en"></script> 

Demo

+0

Danke für Ihre Demo-App, es hat mein Problem gelöst und wie kann ich den Cursor auf eine bestimmte Position setzen und den Benutzer an diesen Ort in dieser Code-Demo leiten? Danke für deine Zeit übrigens – foo0507

0

I implementieren die Demo und es hat funktioniert. Es funktioniert auch, wenn ich im Browser auf den Teil "Auf Google Maps anzeigen" klicke. Ich kann den Benutzer an einen speziellen Ort im Browser in einem neuen Tab verweisen, aber wenn ich auf meinem Android-Gerät "auf Google Maps anzeigen" laufen, ist nicht anklickbar. Ich möchte einfach auf Benutzer durch Google Maps-Anwendung in Android verweisen. Alle Ratschläge und Vorschläge werden sehr geschätzt.

Verwandte Themen