Category Archives: ArcGIS API for JavaScript

Esri JavaScript API: map dijit and DOJO AMD

Posted on by

An example how to use DOJO AMD and aspect after on the map dijit. …

HTML (on.html):

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <title>map dijit and dojo amd</title>
    <style type="text/css">
    @import "//serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/dojo/dijit/themes/claro/claro.css";
    @import "//serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/esri/css/esri.css";
    </style>
    <script type="text/javascript">
    dojoConfig = {
        isDebug:true,
        async:true
    };
    </script>
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.2"></script>
    <script type="text/javascript" src="on.js"></script>
</head>

<body class="claro">
    <div id="mapDiv" style="width:900px; height: 600px; border:1px solid #000; padding:0;"></div>
</body>

</html>​

JavaScript (on.js)

var map;

// esri/dijit/attribution: Unable to show map attribution. Did you forget to require 'esri.dijit.Attribution'?

require(["esri/Map", "dojo/parser", "dojo/on", "dojo/aspect", "esri/dijit/Attribution", "dojo/domReady!"],
    function(Map, parser, on, aspect) {
        parser.parse();
        var initExtent = new esri.geometry.Extent({
            "xmin" : -122.46,
            "ymin" : 37.73,
            "xmax" : -122.36,
            "ymax" : 37.77,
            "spatialReference" : {
                "wkid" : 4326
            }
        });
        var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer");
        map = new esri.Map("mapDiv", {
            extent : esri.geometry.geographicToWebMercator(initExtent)
        });
        map.addLayer(basemap);

        aspect.after(map, 'onLoad', function() {
            alert("Loaded");
        });
});