Exemples de géocodage

Faire un géocodage

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">
         /* Insérez ici votre clé */
         VMAPI.registerKey("JSBS20070201123465789");
         VMAPI.setLanguage("fra");
         
         /* La fonction qui demandera au serveur le géocodage */
         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",display_result);
            geocoder.search(myaddress);
         }
         
         /* La fonction lancée après la réponse du server */
         function display_result(){
            alert("Le code est "+geocoder.result);
         }
         
         /* L'affichage de la liste des pays */
         function load_country(){
            VMCountryUtil.addEventHandler(
                  "onCallBack",
                  function(){
                      document.getElementById("div_country").innerHTML 
                       = VMCountryUtil.getSelectHTMLString("country","FRA");
                     }
                  );
               VMCountryUtil.loadCountryLabels();
           }
      </script>
   </head>
   
   <!-- Lancement automatique du script javascript après le chargement de la page -->
   <body onload="load_country()">
      <h1>ViaMichelin - Exemple de géocodage</h1>
      <p>
         Trouver l'emplacement géographique d'une adresse postale
      </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="Lancer le calcul du géocodage" 
         onclick="geocoder_search();">
      </form>
   </body>
</html>

Documentation associée

Faire une levée d'ambiguïté sur une adresse

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">
    
    /* Insérez ici votre clé */
      VMAPI.registerKey("JSBS20070201123465789");
      VMAPI.setLanguage("fra");

    /* Paramétrage et lancement de la recherche */
    function geocoder_search(){
        geosearch = new VMGeoSearch();
        myaddress = new VMAddress();
         
        var elements_formulaire = document.forms['geocoder_form'].elements;
        var element_pays = elements_formulaire['country'];
        
        myaddress.address = elements_formulaire['form_address'].value;
        myaddress.zipCode = elements_formulaire['form_CP'].value;
        myaddress.city = elements_formulaire['form_city'].value;
        if(typeof(element_pays)!="undefined"){
            myaddress.countryVMCode = element_pays.value;
        } else {
            myaddress.countryVMCode = "FRA";
        }
    
        geosearch.addEventHandler("onCallBack",display_result);
        geosearch.search(myaddress);
    }
    
    /* Le serveur a donné une liste d'adresses */
    function display_result(){
        var tmp = "";
        if (geosearch.results.length == 0){
            alert("Aucun résultat !")
        } else {
            for (var i=0; i<geosearch.results.length; i++){
                tmp +=     "<p> "+ i 
                        + " | Longitude : " 
                        + geosearch.results[i].coords.lon 
                        + " Latitude : " 
                        + geosearch.results[i].coords.lat 
                        + " | <strong>"
                        +geosearch.results[i].VMAmbiguityLine 
                        +"</strong>"
                        + " </p>";
            }
            document.getElementById("yourhtmldiv").innerHTML = tmp;
        }
    }
    
    /* L'affichage de la liste des pays */
    function load_country(){
        VMCountryUtil.addEventHandler(
            "onCallBack",
             function(){
                   document.getElementById("div_country").innerHTML 
                       = VMCountryUtil.getSelectHTMLString("country","FRA");
                 }
             );
         VMCountryUtil.loadCountryLabels();
    }
   </script>
  </head>
  
  <!-- Lancement automatique du script javascript après le chargement de la page -->
  <body onload="load_country()">
      <h1>Exemple de levée d'ambiguïté</h1>
      <p>
          Déterminer quelle est l'adresse que cherche l'utilisateur
      </p>
  
    <form name="geocoder_form">
        <label for="form_adress">Adresse :</label>
        <input type="text" value="Place des Carmes-Déchaux" 
            id="form_address" name="form_address"/>
        
        <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="country">Pays :</label>
        <div id="div_country"></div>
        
        <input type="button" value="Lancer la recherche" 
            onclick="geocoder_search();"/>
        
        <div id="yourhtmldiv"></div>
    </form>
  </body>
</html>

Documentation associée

Créer une liste de pays

Voir l'exemple 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8">
        <title>ViaMichelin Maps & Drive API</title>
                 
        <!-- Librairies Via Michelin -->
        <script src="http://api.viamichelin.com/apijs/js/api.js" 
            type="text/javascript"></script>

        <!-- Code Javascript qui va afficher la carte -->        
         <script type="text/javascript">
             /* Clef d'enregistrement et langue de l'utilisateur */
             VMAPI.registerKey("JSBS20070201123465789");
             VMAPI.setLanguage("fra");
            
            /* L'affichage de la liste des pays */
            function load_country(){
                VMCountryUtil.addEventHandler("onCallBack",function(){
                    document.getElementById("div_country").innerHTML = 
                        VMCountryUtil.getSelectHTMLString("country","FRA");
                });
                VMCountryUtil.loadCountryLabels();
            }
        </script>
    </head>

    <!-- Lancement automatique du script javascript après le chargement de la page -->
    <body onload="load_country()">
        <h1>ViaMichelin - Exemple de liste de pays</h1>
        <p>
            Afficher la liste des pays sélectionnables
        </p>
    
        <label for="country">Pays</label>
        <div id="div_country"></div>
    </body>
</html>

Documentation associée