Building a custom, dynamic legend using ArcGis-server js and dynamicMapServiceLayer

Question

I have a dynamicMapServiceLayer that I am using to build a map application. There are about 10 layers in the mapservice that I am toggling using the setVisibleLayers action.

I would like to build my own custom, dynamic map legend. When a layers' visiblity is toggled, the corresponding legend item would also hide() / show()

My mapServer has a url that links to a page with all the corresponding legend items like below except my legend's url has 10 legend items

http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Petroleum/KGS_OilGasFields_Kansas/MapServer/legend

Is there a way I can access the individual legend items (Name and symbol) from a existing mapServer? I am comfortable building the legend, I just need to know how to access the layers' symbols which I will then append to a legend dialog.

I should also mention that I am avoiding using DOJO and using pure javascript and jQuery.

Answer 1

If you access that service via the REST API:

http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Petroleum/KGS_OilGasFields_Kansas/MapServer/legend?f=json&pretty=true

You can get the JSON using jQuery http://api.jquery.com/jQuery.getJSON/ So build the legend yourself from that data you have retrieved.

To add the legend symbols, you can use jQuery to create an img, and insert each legend item's contentType and imageData into the src to render the symbol.

https://stackoverflow.com/questions/5000710/receive-image-data-as-json-and-injecting-it-into-the-dom/5000778#5000778

Make sense?