The TableOfContents widget provides a table of contents that allows the toggling of layer visibility. The style can be completely changed and skinned to match your own map design.

This widget does not support toggling individual sublayers (i.e. visibleLayers of dynamic map service).

View it live

var map = response.map;
var layers = response.itemInfo.itemData.operationalLayers;

myWidget = new TableOfContents({
  map: map,
  layers: layers
}, "TableOfContents");
myWidget.startup();

New to Github? Get started here.

Set your dojo config to load the module.

var package_path = window.location.pathname.substring(0, window.location.pathname.lastIndexOf('/'));
var dojoConfig = {
	// The locationPath logic below may look confusing but all its doing is
	// enabling us to load the api from a CDN and load local modules from the correct location.
	packages: [{
		name: "application",
		location: package_path + '/js'
	}]
};

Include the module for the TOC.

require(["application/TableOfContents", ... ], function(TableOfContents, ... ){ ... });

TableOfContents(options, srcNode);

This is what the layers array should look like. It follows the response from a webmap's operational layers.

layers = [
	{
 	   layer: LayerObject
	    defaultSymbol: Symbol
	    title: String
	},
	{
		...
	}
];

startup(): Start the widget.

destroy(): Destroy the widget.

show(): Show the widget.

hide(): hide the widget.

refresh(): reload all layers and properties that may have changed.

on(widget, 'load', function(evt){…})

{}

on(widget, 'toggle', function(evt){…})

{
	expand: <Boolean>,
    index: <integer>
}

• Notepad or HTML editor
• A little background with Javascript
• Experience with the ArcGIS Javascript API would help.

• ArcGIS for JavaScript API Resource Center
• ArcGIS Blog
• twitter@esri

Find a bug or want to request a new feature? Please let us know by submitting an issue.

Anyone and everyone is welcome to contribute.

Copyright 2012 Esri

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

A copy of the license is available in the repository's license.txt file.

[](Esri Tags: ArcGIS JavaScript API Layer TOC Table of Contents Public) [](Esri Language: JavaScript)