woring Iam sur google maps avec AngularJS 1.x et toutes les cartes google bibliothèque javascript est chargé et il ne montre pas sur la balise divGoogle map ne se charge pas dans AngularJS et aucune erreur de la console javascript
-1
A
Répondre
0
Avez-vous ajouté une largeur et une hauteur pour le div
censé contenir la carte. Veuillez trouver la directive de carte ci-dessous que j'ai écrite, réutilisée et modifiée en fonction des besoins.
Il peut être utilisé comme,
<map trip="latLongObj" on-create="controllerFunction()"></map>
et la définition est,
function map($window) {
return {
restrict: 'E',
scope: {
onCreate: '&',
trip: '=',
location: '@'
},
link: function ($scope, $element) {
var DirectionsDisplay;
var DirectionsService = new google.maps.DirectionsService();
function initialize(trip) {
DirectionsDisplay = new google.maps.DirectionsRenderer();
var origin = {}, destin = {};
if (!$scope.location) {
origin.lat = trip.origin.latitude;
origin.long = trip.origin.longitude;
destin.lat = trip.destination.latitude;
destin.long = trip.destination.longitude;
} else {
origin.lat = trip.location.latitude;
origin.long = trip.location.longitude;
}
var mapOptions = {
center: new google.maps.LatLng(origin.lat, origin.long),
zoom: 13,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: false,
streetViewControl: false
};
var map = new google.maps.Map($element[0], mapOptions);
if (!$scope.location) {
DirectionsDisplay.setMap(map);
DirectionsService.route({
origin: new google.maps.LatLng(origin.lat, origin.long),
destination: new google.maps.LatLng(destin.lat, destin.long),
travelMode: google.maps.TravelMode.DRIVING
}, function (response, status) {
if (status === google.maps.DirectionsStatus.OK) {
DirectionsDisplay.setDirections(response);
} else {
$window.alert('Directions request failed due to ' + status);
}
});
}
$scope.onCreate({ map: map });
}
$scope.$watch('trip', function (trip) {
if (trip) {
initialize(trip);
}
}, true)
}
}
}
Vous pouvez acheive sans avoir un observateur, et l'utilisation de ng-si en utilisant la directive assurez-vous qu'il y a des données.
montrez-nous le code où vous avez échoué ' –