Gérer les zooms

function DoZoom() {
        var zoom = document.getElementById('zoomLevel').value;
        map.SetZoomLevel(zoom);
     }

 

function DoZoomIn() {
        map.ZoomIn();
     }
    
function DoZoomOut() {
        map.ZoomOut();
     }
   

<body>

<div>
      <input type='button' value='Zoom In' onclick='DoZoomIn();' />
      <input type='button' value='Zoom Out' onclick='DoZoomOut();'/> 

      Indiquer un niveau de zoom :

      <input id='zoomLevel' type='text' style='width:15px;' value='10' />
      <input type='button' value='Set zoom' onclick='DoZoom();' />
</div>

//suite du code

</body>

 

code source
Code source © Benchmark Group

Le niveau de zoom varie de 1 à 19. Pour gérer les zooms, il faut ajouter quelques fonctions dans la deuxième balise <script>, celle qui contient l'implémentation de l'application.

DoZoom() récupère le niveau de zoom en cours et l'attribue à la page.

DoZoomIn() augmente le zoom de 1, tandis que DoZoomOut() le diminue d'autant.

 

Dans le corps de la page, à l'intérieur des balises <div>, un bouton va indiquer un zoom avant (augmenter le niveau de 1) et un autre va indiquer un zoom arrière (diminuer le niveau de 1). Une zone de texte permet de saisir un niveau de zoom. Dans notre exemple, le zoom par défaut est à 10. Un bouton valide la saisie et appelle la fonction DoZoom().