all html : Le portail des webmaster

liste des forums liste des discussions Participer à la discussion

Message publié le mercredi 06 septembre 2006 - 14h25 par charly75. charly75 <http://www.visite-egypte.com>

Pour commencer : il faut impérativement vous inscrire dans le programme Google Maps API

Une fois que cela est fait, mettre la clé dans le premier script à la place de "votre clé google".

Ensuite vous devez modifier la ligne qui contient le "map.setCenter"
- new GLatLng(27.1373,31.5527) est pour les longitudes et les latitudes
- ,6, c'est la profondeur du zoom
- G_SATELLITE_MAP indique que la carte s'affiche en version satellite

Pour finir votre personnalisation :
Vous pouvez rajouter des points de ciblage et des bulles d'infos.

Ne mettre que des liens du type [url=http://www.monsite.com/mesimages/etc.jpg]http://www.monsite.com/mesimages/etc.jpg

exemple de point : var point = new GLatLng(30.0386,31.2245);

exemple de bulle avec liens + images :
var marker = createMarker(point,'<div class="texte-11"><a xhref="url de votre lien">Le Caire</a><br><img xsrc="url de votre image" border="0" height="80" width="180"><br>votre texte</div>')

voici le code complet pour un démarrage en douceur surtout laissez dans la partie BODY le id="message". C'est lui qui vous aidera à trouver vos lat. et long.:

Dans le HEAD
<script xsrc="http://maps.google.com/maps?file=api&amp;v=2&amp;key=votre clé google" type="text/javascript"></script> <script type="text/javascript"> //<![CDATA[ function load(){ if (GBrowserIsCompatible()){ function createMarker(point,html) { var marker = new GMarker(point); GEvent.addListener(marker, "click", function() { marker.openInfoWindowHtml(html); }); return marker; } var map = new GMap2(document.getElementById("map")); GEvent.addListener(map, "moveend", function() { var center = map.getCenter(); document.getElementById("message").innerHTML = center.toString(); }); map.setCenter(new GLatLng(27.1373,31.5527),6,G_SATELLITE_MAP); /* controle du zoom*/ map.addControl(new GSmallMapControl()); /* type de zoom carte ou sat */ map.addControl(new GMapTypeControl()); /* fenetre d'information lat long*/ map.openInfoWindow(map.getCenter(), /* ajout d'un point cliquable avec bulle */ var point = new GLatLng(30.0386,31.2245); var marker = createMarker(point,'<div class="texte-11"><a xhref="url de votre lien">Le caire</a><br><img xsrc="url de votre image" border="0" height="80" width="180"><br>votre texte</div>') map.addOverlay(marker); } } //]]> </script>

dans le BODY :
<div align="center" id="map" style="width: 500px; height: 500px"></div> <div id="message" class="texte" align="center"></div>

- Voir le resultat avec liens : Louxor
- Voir le resultat avec zoom precis + images et liens : Louxor

Merci de complèter si vous avez mieux.

• participer

Message publié le vendredi 08 janvier 2010 - 11h03 par joro21.

Bonjour,

Ce site est vraiment super...
Mais je n'ai pas tout compris car j'utilise la V3 de google MAP, donc je n'ai pas de clé a rentrer mais je n'arrive pas à faire la map avec des liens et des images si quelqu'un pourrait m'informer avec des informations supplémentaire.

Merci d'avance

Joro21

• participer

liste des forums liste des discussions Participer à la discussion

Vous devez obligatoirement vous identifier en tant que membre pour participer à cette discussion.