ArcGIS JavaScript API – Table of Contents Sample

arcgis-javascript-apiweb-mapping

Where can I find an example of a Table of Contents control to plug into the ArcGIS Server JavaScript API 2.3? Ideally it should support feature/dynamic/tiled layers; show symbology; and allow grouped layers. Transparency and zoom-to functionality would be ideal.

The Esri samples page is strangely lacking in any TOC examples – the nearest example is the extremely rudimentary Toggle Layer Visibility.

Answers to Kirk's question show a few templates but they don't contain a decent TOC. The ROK sample is close but doesn't show symbology or support feature layers (as far as I can see).

The TOC on the ArcGIS.com My Map viewer is almost exactly what I need. Has anyone managed to build something similar, or get this TOC working locally?

enter image description here

Best Answer

Is this what you are looking for? I found it by searching the Code Gallery page on the ArcGIS API for Javascript Resource Center.

Related Solutions

[GIS] How to add a Group Layer control to a Table of Contents sample

I haven't implemented it yet, but the sample at http://www.thejekels.com/dojo/Dijit_Tree_Chkbox.html looks suitable. This is what the TOC sample cited above uses. I'll try to customise it for my purposes

[GIS] How to use onLayerAddResult in the ArcGIS Server JavaScript API

The event fires every time a layer is added, not just the first time. In that sample, three different layers are added. You need to disconnect your connect after it is fired the first time if you only want to know when the first layer has been added. To do this, you need to assign your connect to a variable to keep reference to it and then disconnect using that reference.

var connectFirstLayerAdd = dojo.connect(map, "onLayerAddResult", this, function(){
     dojo.disconnect(connectFirstLayerAdd);
     alert("test");
});

Also, the third argument is a scoping argument for running the function. I suspect you would not want to use operationalLayer as your scope. I scope it to this because I need connectFirstLayerAdd to be in the scope of the connected function, otherwise it will not be able to successfully execute the call to dojo.disconnect.

If you do need to scope the function to operationalLayer then instead you need to assign your connect to a property of operationalLayer

operationalLayer.connectFirstLayerAdd = dojo.connect(map, "onLayerAddResult", operationalLayer, function(){
     dojo.disconnect(connectFirstLayerAdd);
     alert("test");
});

Best Answer

Related Solutions

[GIS] How to add a Group Layer control to a Table of Contents sample

[GIS] How to use onLayerAddResult in the ArcGIS Server JavaScript API

Related Question