2

Does anyone have an example of how to display a "loading" image in the new AMD environment of ESRI's JSAPI? Familiar with doing it in the past, just seems there's quite a lack of documentation. Thanks.

2

Here what the sample looks like in AMD

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
    <title>Simple Map</title>
    <link rel="stylesheet" href="http://js.arcgis.com/3.7/js/esri/css/esri.css">
    <style>
      html, body, #map {
        height: 100%;
        width: 100%;
        margin: 0;
        padding: 0;
      }
      body {
        background-color: #FFF;
        overflow: hidden;
        font-family: "Trebuchet MS";
      }
    </style>
    <script src="http://js.arcgis.com/3.7/"></script>
    <script>
        var map;

        require(["esri/map", "dojo/dom","dojo/domReady!"], function (Map, dom) {
            map = new Map("map", {
                basemap: "topo",
                center: [117.773, 28.498], // long, lat
                zoom: 6,
                sliderStyle: "small"
            });

            var loading = dom.byId("loadingImg");

            var dynamicMapServiceLayer = new esri.layers.ArcGISDynamicMapServiceLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Population_World/MapServer");
            dynamicMapServiceLayer.setOpacity(0.4);
            map.addLayers([dynamicMapServiceLayer]);

            map.on("update-start", function () {
                esri.show(loading);
            });

            map.on("update-end", function () {
                esri.hide(loading);
            });

        });
    </script>
  </head>

  <body class="claro">
    <div id="map" style="position:relative; width:1024px; height:512px; border:1px solid #000;">
      <img id="loadingImg" src="images/loading.gif" style="position:absolute; right:512px; top:256px; z-index:100;" />
    </div>
  </body>
</html>
  • Thanks @kenbuja, slowly getting this AMD stuff. Wanting to add basics to see the differences. Display current scale on screen (1=200') is next thing I'm looking to do. – ripsin Oct 24 '13 at 18:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.