Mettre une carte dans une partie d'une page HTML est une chose facile avec Microsoft MAP. Exemple en HTML et JavaScript.

Mettre une carte dans un coin d’une page HTML

Capture de la carte Microsoft incrustée

Mettre une carte dans une partie d’une page HTML est une chose facile avec Microsoft MAP.

Voici en dessous un exemple de code pour faire apparaitre dans une “<DIV>” la carte avec la punaise du lieu recherché.

la syntaxe pour appeler cette page est lienserver/chemin/map.html?lieu=adresse&nom=quoi

Par exemple, pour le Louvre à Paris la syntaxe serait (…)/map.html?lieu=Paris&nom=Louvre . Ce qui nous donne la carte avec la punaise sur le Louvre.

Le fichier HTML est structuré en plusieurs parties : La première sur le chargement d’un script qui contient l’objet ‘VEMap’. La seconde partie contient un script perso pour construire la carte. La troisième et dernière partie, la partie HTML avec la zone ‘<DIV>’ qui recevra la carte.
Si vous executez ce script directement depuis le disque, vous risquez d’avoir les messages d’alerte pour l’exécution des scripts. Par contre, c’est sans souci si vous mettez cette page dans un serveur Inter/Intra/extra/net.

Pour toutes les commandes accessibles depuis le script, rendez-vous sur le site de Microsoft : http://msdn.microsoft.com/en-us/library/bb429586.aspx

Le fichier HTML est le suivant :

[php] <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html>
<head>
<title></title>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
<script type=”text/javascript” src=”http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.2″></script>

<script type=”text/javascript” language=”javascript”>
var map = null;
var latLong=null;
var lieu = “”;
var nom=””;
//cible=windows.document.location.href;

function GetMap()
{
var reg=new RegExp(” “, “g”);
var requete = window.location.search;
requete = requete.substring(1,requete.length);
var elements = requete.split(“&”);
for(i = 0; i < elements.length; i++) {
temp = elements[i].split(“=”);
switch (temp[0].toLowerCase()){
case “lieu”:
lieu = unescape(temp[1]);//.replace(reg,”+”);
break;
case “nom”:
nom = unescape(temp[1]);
break;
}
}
map = new VEMap(‘myMap’);
map.SetDashboardSize(VEDashboardSize.Small);//Normal Small Tiny
map.LoadMap(null,19);
map.Find(nom, lieu,VEFindType.Businesses,null,5,5,true,true,true,true);
map.SetMapMode(VEMapMode.Mode2D);
map.SetMapStyle(VEMapStyle.Roadmap);

}
function Zoom(level){
map.SetZoomLevel(level);
}
</script>
</head>
<body onload=”GetMap();” >
<div id=’myMap’ style=”position:relative; width:350px; height:260px; “></div>
<a style=”cursor:pointer” onclick=”window.open(‘http://www.bing.com/maps/?where1=’+lieu+’&what=’+nom)”>zoom</a>
</body>
</html> [/php]

A propos Martial Auroy

Mon goût pour les défis et pour la création m’ont amené à la direction de trois services informatiques. Dans le domaine industriel, dans la gestion de production, dans les ressources humaines et la paie. Créatif et Ingénieur de formation, j’ai pu développer et mettre en place des systèmes informatiques divers. Gestion de paies internationale, appareils de mesure dans les ateliers de l’aérospatiale ou des robots pour la fabrication de cosmétiques. Le Web m’est bien connu. La sécurité et la communication ont toujours été parties intégrantes des projets mis en place : Sécurité d’intrusion, d’accès et de traçabilité. Je suis curieux et toujours à la recherche de connaissance. J’aime le cinéma, la philosophie, voyager.

Je vous propose également...

Faire disparaitre le scroll vertical de IE9 1

Faire disparaitre le scroll vertical de IE9

Vous avez remarqué que dans L'IE9, le scroll vertical est toujours visible; Même si la page n'est pas scrollable. Pour que le scroll n'apparaisse plus...

Twitter Bootstrap 2

Twitter Bootstrap

Parfois on est obligé de faire du développement web alors que ce n’est pas notre …

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *