Maroc google Maps

1 Commentaire

Aujourd’hui nous allons voir un truc qu’on trouve souvent en tant que développeur, internaute,…… C’est lorsque’on utilise google maps  pour afficher des informations et je parle plus précieusement lorsqu’on affiche notre beau pays le Maroc, On se retrouve avec le trait qui découpe le Maroc.

Pour résoudre ce problème, l’API google offre certains objets.

L’idées est la suivante :

  1. Désactiver les frontières entre les pays.
  2. Retracer à nouveau les vrais frontières.

Tout cela est possible  grâce à l’API google maps javascript

Je vous donne un petit exemple :

 

var mapOptions = {
	zoom: 5,
	center: oujda,
	mapTypeId: google.maps.MapTypeId.ROADMAP,
	};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

// Désactiver l'affichage des frontières 
var marocStyles = [{featureType: "administrative.country",stylers: [{ visibility: "off" }]}];
var marocMapType = new google.maps.StyledMapType(marocStyles ,{name: "Maroc"});

// Associer la carte de style avec le MapTyped 
map.mapTypes.set('maroc', marocMapType );
map.setMapTypeId('maroc');

Si on affiche maintenant la carte ou aura :

carte_sans_frontiere

 

 

Pour le moment nous allons tracer les  frontières  à nouveau.

Vous ajoutez ce bout de code au précédent

 
layer = new google.maps.FusionTablesLayer({
     query: {
             select: 'geometry',
             from: '1S4aLkBE5u_WS0WMVSchhBgMLdAARuPEjyW4rs20',
	     where: "col1 contains 'MAR'"
	    },
      styles: [{
	    polylineOptions: {
	    strokeColor: "#FF0000",
	    strokeWeight: 1
	}
    }]
});
layer.setMap(map);

carte_frontiere

 

 

  • Zouhair

    Bonjour,

    votre code publié m’a était très utile merci,

    Mais j’ai trouver un souci, après l’ajout de ce bou de code, quand je mets le zoom vers l’arrière

    j’ai deux marker qui s’affiche dans la carte en rouge au maroc à la fin du zoom quand on clique sur le moin.

    Est ce que tu as le même souci que moi, si tu as corriger, tu peux me dire comment tu as fait c’est urgent pour moi :s

    Merci