AnsweredAssumed Answered

How to show zoom level at the bottom of the map when the user zooms in and out?

Question asked by siyakubeka on Jul 22, 2020
Latest reply on Jul 22, 2020 by siyakubeka

Hi All,

I have an Esri map, what I want to do with it is to show the zoom level at the bottom or anywhere in the map when the user zooms in or out. How can I do that? Below is the sample of the map that I am using.

 

<!DOCTYPE html>

<html>

  <head>

    <meta charset="utf-8" />

    <meta

      name="viewport"

      content="initial-scale=1,maximum-scale=1,user-scalable=no"

    />

    <title>DEA GIS APPLICATION</title>

 

    <link

      rel="stylesheet"

      href="https://js.arcgis.com/4.12/esri/themes/light/main.css"

    />

    <script src="https://js.arcgis.com/4.12/"></script>

 

    <style>

      html,

      body,

      #viewDiv {

        padding: 0;

        margin: 0;

        height: 100%;

        width: 100%;

      }

    </style>

    <script>

      require([

        "esri/widgets/Sketch",

        "esri/Map",

        "esri/layers/GraphicsLayer",

        "esri/views/MapView"

      ], function(Sketch, Map, GraphicsLayer, MapView) {

        const layer = new GraphicsLayer();

 

        const map = new Map({

          basemap: "streets",

          layers: [layer]

        });

 

        const view = new MapView({

          container: "viewDiv",

          map: map,

          zoom: 5,

          center: [90, 45]

        });

 

        const sketch = new Sketch({

          layer: layer,

          view: view,

          availableCreateTools: ["point"]

        });

 

        view.ui.add(sketch, "top-right");

       

        sketch.on('create', function(evt){

                                           console.log("X = ", evt.graphic.geometry.x);

                                           console.log("Y = ", evt.graphic.geometry.y);

                             });

      });

    </script>

  </head>

 

  <body>

    <div id="viewDiv"></div>

  </body>

</html>

 

Kind Regards

Siyabonga Kubeka

0761040911

Outcomes