Hide Table of Contents
View Layer definitions on a dynamic map service sample in sandbox
Layer definitions on a dynamic map service

Description

This sample demonstrates how to use layer definitions to limit the information from a layer that gets displayed on the map. To appreciate what this sample does, it's helpful to look at the Services Directory page for the ESRI_Census_USA service used in this map. Examine the list of layers in the map. Now notice that this line of code limits the visible layers to states and counties.

dynamicMapServiceLayer.setVisibleLayers([5,4,3]);

This data covers the United States, so why does only the state of Kansas appear when you run the sample? This is due to layer definitions, which are SQL expressions that limit the data shown on the map. In this sample, the layer definitions limit the states to Kansas and the counties to those in Kansas with a population over 25000.

The following code adds layer definitions to an array, then applies the definitions using the ArcGISDynamicMapServiceLayer.setLayerDefinitions() method. Notice that in the array, the index of a definition matches its corresponding layer index in the map:

var layerDefs = [];
layerDefs[5] = "STATE_NAME='Kansas'";
layerDefs[4] = "STATE_NAME='Kansas' and POP2007>25000";
layerDefs[3] = "STATE_NAME='Kansas' and POP2007>25000";
dynamicMapServiceLayer.setLayerDefinitions(layerDefs);

If you're new to building SQL expressions, a helpful resource is About building an SQL expression in the ArcGIS Desktop Help.

Code

<!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>Create Map with Custom ArcGISDynamicMapServiceLayer Layer
      Definitions</title>

    <link rel="stylesheet"
          href="https://js.arcgis.com/3.20/esri/css/esri.css"/>
    <style>
      html, body, #mapDiv {
        padding: 0;
        margin: 0;
        height: 100%;
      }

    </style>

    <script src="https://js.arcgis.com/3.20/"></script>
    <script>
      var map;

      require([
        "esri/map",
        "esri/layers/ArcGISDynamicMapServiceLayer",
        "esri/layers/ImageParameters",
        "dojo/domReady!"
      ],
        function (Map, ArcGISDynamicMapServiceLayer, ImageParameters) {

          map = new Map("mapDiv", {
            basemap: "streets",
            center: [-98.258, 38.236],
            zoom: 7
          });

          //Use the ImageParameters to set map service layer definitions and map service visible layers before adding to the client map.
          var imageParameters = new ImageParameters();

          //ImageParameters.layerDefinitions takes an array.  The index of the array corresponds to the layer id.
          //In the sample below an element is added in the array at 3, 4, and 5 indexes.
          //Those array elements correspond to the layer id within the remote ArcGISDynamicMapServiceLayer
          var layerDefs = [];
          layerDefs[5] = "STATE_NAME='Kansas'";
          layerDefs[4] = "STATE_NAME='Kansas' and POP2007>25000";
          layerDefs[3] = "STATE_NAME='Kansas' and POP2007>25000";
          imageParameters.layerDefinitions = layerDefs;

          //I want layers 5,4, and 3 to be visible
          imageParameters.layerIds = [5, 4, 3];
          imageParameters.layerOption = ImageParameters.LAYER_OPTION_SHOW;
          imageParameters.transparent = true;

          //construct ArcGISDynamicMapServiceLayer with imageParameters from above
          var dynamicMapServiceLayer = new ArcGISDynamicMapServiceLayer("https://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer",
            {"imageParameters": imageParameters});

          map.addLayer(dynamicMapServiceLayer);
        });
    </script>
  </head>

  <body>
    <div id="mapDiv"></div>
  </body>
</html>