Hide Table of Contents
Analysis
Dynamic Layers
Editing
Feature Layers
Feature Table
Graphics
Map
Mobile
Online and Portal
Popups and Info Windows
Query and Select
Renderers, Symbols, Visualization
Search
Explore in the sandbox
Open in CodePen
View live sample
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 theCensusservice 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([3,2,1]);
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[3] = "STATE_NAME='Kansas'"; layerDefs[2] = "STATE_NAME='Kansas' and POP2007>25000"; layerDefs[1] = "STATE_FIPS='20' and POP2007>25000"; dynamicMapServiceLayer.setLayerDefinitions(layerDefs);
If you're new to building SQL expressions, a helpful resource isAbout building an SQL expressionin 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.46/esri/css/esri.css"/>
<style>
html, body, #mapDiv {
padding: 0;
margin: 0;
height: 100%;
}
</style>
<script src="https://js.arcgis.com/3.46/"></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-vector",
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, 2, and 1 indexes.
//Those array elements correspond to the layer id within the remote ArcGISDynamicMapServiceLayer
var layerDefs = [];
layerDefs[3] = "STATE_NAME='Kansas'";
layerDefs[2] = "STATE_NAME='Kansas' and POP2007>25000";
layerDefs[1] = "STATE_FIPS='20' and POP2007>25000";
imageParameters.layerDefinitions = layerDefs;
//I want layers 3,2, and 1 to be visible
imageParameters.layerIds = [3, 2, 1];
imageParameters.layerOption = ImageParameters.LAYER_OPTION_SHOW;
imageParameters.transparent = true;
//construct ArcGISDynamicMapServiceLayer with imageParameters from above
var dynamicMapServiceLayer = new ArcGISDynamicMapServiceLayer("https://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer",
{"imageParameters": imageParameters});
map.addLayer(dynamicMapServiceLayer);
});
</script>
</head>
<body>
<div id="mapDiv"></div>
</body>
</html>