You are here: Home / Code and APIs for developers / GIS applications API / ESRI API / JavaScript example

JavaScript example

Page Last modified 04 Nov 2011, 09:53 AM
This sample displays a map from DiscoMap server. The map is cached, meaning it has a set of pre-rendered tiles that the server administrator has built to aid performance. For this reason the map is represented by ArcGISTiledMapServiceLayer.

If the map service does not have a cache available, use ArcGISDynamicMapServiceLayer. If you don't know whether a service has a cache available, you can use the Services Directory to find out. Notice EEA naming convention. When the map-service contains _Cach_ it means that this service has a tiling schema. _Dyna_ means that the service produces images on the fly. Most of the time both are available. It's obvious that a tiled service will perform better then a dynamic service.

To find more about ESRI API's go to

The ESRI API's can be used freely when your website is not a commercial site.

Live example

Source code

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "">
<meta http-equiv="X-UA-Compatible" content="IE=7" />
  <title>ArcGIS JavaScript API: Air/EPRTRDiffuseAir_Dyna_WGS84</title>
  <link href='/ArcGIS/rest/ESRI.ArcGIS.Rest.css' rel='stylesheet' type='text/css'>
<style type="text/css">
  @import "";
html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
      .tundra .dijitSplitContainer-dijitContentPane, .tundra .dijitBorderContainer-dijitContentPane#navtable { 
        PADDING-BOTTOM: 5px; MARGIN: 0px 0px 3px; PADDING-TOP: 0px; BORDER-BOTTOM: #000 1px solid; BORDER-TOP: #000 1px solid; BACKGROUND-COLOR: #E5EFF7;
      .tundra .dijitSplitContainer-dijitContentPane, .tundra .dijitBorderContainer-dijitContentPane#map {
        overflow:hidden; border:solid 1px black; padding: 0;
      #breadcrumbs {
        PADDING-RIGHT: 0px; PADDING-LEFT: 11px; FONT-SIZE: 0.8em; FONT-WEIGHT: bold; PADDING-BOTTOM: 5px; MARGIN: 0px 0px 3px; PADDING-TOP: 0px;
      #help {
        PADDING-RIGHT: 11px; PADDING-LEFT: 0px; FONT-SIZE: 0.70em; PADDING-BOTTOM: 5px; MARGIN: 0px 0px 3px; PADDING-TOP: 3px; 
<script type="text/javascript" src=""></script>
<script type="text/javascript">
  var map;
  function Init() {"map"), { width: dojo.contentBox("map").w + "px", height: (esri.documentBox.h - dojo.contentBox("navTable").h - 40) + "px" });
    map = new esri.Map("map");
    var layer = new esri.layers.ArcGISDynamicMapServiceLayer("");
var resizeTimer;
                            dojo.connect(map, 'onLoad', function(theMap) {
                              dojo.connect(dijit.byId('map'), 'resize', function() {
                                resizeTimer = setTimeout(function() {
                                 }, 500);
<body class="tundra">
<table style="width:100%">
<table id="navTable" width="100%">
<tr valign="top">
<td id="breadcrumbs">
ArcGIS JavaScript API: Air/EPRTRDiffuseAir_Dyna_WGS84
<td align="right" id="help">
Built using the  <a href="">ArcGIS JavaScript API</a>
<div id="map" style="margin:auto;width:97%;border:1px solid #000;"></div>
Example was created by Bilbomatica.
European Environment Agency (EEA)
Kongens Nytorv 6
1050 Copenhagen K
Phone: +45 3336 7100