Various examples

Insert a logo on geographical coordinates

Voir l'exemple
<html>
 <head>
 <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
 <title>ViaMichelin Maps & Drive API</title>
 
 <script src="http://api.viamichelin.com/apijs/js/api.js" 
 type="text/javascript"></script>
 <script type="text/javascript">
 /* Insert your key */
 VMAPI.registerKey("JSBS20070201123465789");
 VMAPI.setLanguage("fra");
 
 function initialise_adresse_et_carte(){
 var map = new VMMap(document.getElementById("yourmapdiv"));
 
 var localisation_entreprise = new VMLonLat(2.24344,48.83381);
 map.drawMap(localisation_entreprise, 15);
 
 /* Create an image object */
 var image = new VMIcon('http://dev.viamichelin.fr/wswebsite/fra/img/petit_bib.gif',-12,-12);
 /* Create a layout for the image */
 var coucheImage = new VMIconLayer(
 localisation_entreprise, 
 image, 
 "Via Michelin"
 );
 /* Add the layout on the map */
 map.addLayer(coucheImage);
 
 map.showMapTools();
 }
 </script>
 </head>
 
 <!-- Automatic script launch, after the page loading -->
 <body onload="initialise_adresse_et_carte();">
 <h1>ViaMichelin - Logo example</h1>
 <p>Add a logo on a map</p>
 <div id="yourmapdiv" style="width:400px; height:320px"></div>
 </body>
</html>

Documentation

Read actual map coordinates

Voir l'exemple
<html>
 <head>
 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
 <title>ViaMichelin Maps & Drive API</title>
 
 <script src="http://api.viamichelin.com/apijs/js/api.js"
 type="text/javascript"></script>
 <script type="text/javascript">
 /* Insert your key */
 VMAPI.registerKey("JSBS20070201123465789");
 VMAPI.setLanguage("fra");
 var map;
 function initialise_adresse_et_carte(){
 map = new VMMap(document.getElementById("yourmapdiv"));
 map.drawMap(new VMLonLat(2.24344,48.83381), 15);
 map.showMapTools();
 }
 
 function coordonnees(){
 /* Whatever the movements on the map, the method getCenter() returns current coordinates of the map center */
 alert(map.getCenter());
 }
 </script>
 </head>
 
 <!-- Automatic script launch, after the page loading -->
 <body onload="initialise_adresse_et_carte();">
 <div id="yourmapdiv" style="width: 500px; height: 500px"></div>
 <input type="button" value="Coordinate calcul"
 onclick="coordonnees()" />
 </body>
</html>

Documentation

GPS Personal Navigation Devices export

Voir l'exemple
<html>
 <head>
 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
 <title>ViaMichelin Maps & Drive API</title>
 
 <script src="http://api.viamichelin.com/apijs/js/api.js"
 type="text/javascript"></script>
 <script type="text/javascript">
 /* Insert your key */
 VMAPI.registerKey("JSBS20070201123465789");
 VMAPI.setLanguage("fra");
 function geocoder_search(){
 geocoder = new VMGeocoder();
 myaddress = new VMAddress();
 
 var elements_formulaire = 
 document.forms['geocoder_form'].elements;
 myaddress.address = elements_formulaire['form_address'].value;
 myaddress.zipCode = elements_formulaire['form_CP'].value;
 myaddress.city = elements_formulaire['form_city'].value;
 myaddress.countryVMCode = elements_formulaire['country'].value;
 
 geocoder.addEventHandler("onCallBack",export_function);
 geocoder.search(myaddress);
 }
 
 /* Display the countries list */
 function load_country(){
 VMCountryUtil.addEventHandler(
 "onCallBack",
 function(){
 document.getElementById("div_country").innerHTML 
 = VMCountryUtil.getSelectHTMLString("country","FRA");
 }
 );
 VMCountryUtil.loadCountryLabels();
 }
 
 /* Export into a file */
 function export_function(){
 myexport = new VMExportAsXVM();
 myexport.exportXVM(geocoder.result,"export_file");
 }
 </script>
 </head>
 
 <!-- Automatic script launch, after the page loading -->
 <body onload="load_country();">
 <h1>ViaMichelin - Export example</h1>
 <p>Export coordinates into your GPS</p>
 
 <form name="geocoder_form">
 
 <label for="form_address">Adresse :</label>
 <input type="text" value="Place des Carmes-D�chaux"
 name="form_address" id="form_adress" />
 
 <br />
 
 <label for="form_CP">Code Postal :</label>
 <input type="text" value="63040" name="form_CP" 
 id="form_CP" />
 
 <br />
 
 <label for="form_city">Ville :</label>
 <input type="text" value="CLERMONT-FERRAND"
 name="form_city" id="form_city" />
 
 <br />
 
 <label for="form_country">Pays :</label>
 <div id="div_country"></div>
 
 <br />
 
 <input type="button" value="Tester" onclick="geocoder_search();">
 
 </form>
 
 </body>
</html>

Documentation