Use Transparency Settings from a Map Service in a Web App

Question

Hi, I am currently working on getting a map service I have published to display in a web app using the js API. I currently have 24 layers within the service, 4 of which are polygons that I want to have a slight transparency. I have set the transparency for those layers in the .mxd and was wondering how to carry that over to my web app.

When I load the service as a DynamicMapServiceLayer I am able to display my data but the transparency does not work. I can see a transparency value when I look at the individual layers in the service directory. I also noticed that if I pull my service into an arcgis.com map that the transparency is applied correctly for my 4 polygon layers. My service was published using desktop 10.2 to a 10.2 server instance.

I have done quite a bit of digging and have not been able to find an answer.  Based on the nature of the app I'd rather not break the service into multiple smaller services. Essentially I am looking for a way to use the transparency setting that is visible in the service in order to have transparency on individual layers.

Sorry if this has been asked before. I have not been able to find an answer that worked for me.

Thanks!

BrandonFlessner · Answer

To set transparency for an individual layer, I had to enable support for dynamic layer on the map service in ArcGIS Server, set the image format to PNG32 for the dynamic layer --> layer.setImageFormat('png32'); There should be an easier way...

The problem with Jake Skinner's​ answer is that it will cause 2 requests to the map service every time the user pans, zooms, etc. If you have 24 layers with 24 different transparencies, this can quickly overwhelm a service.

SpencerV · Answer

Hi Jake,

There is no way to utilize that transparency setting like the arcgis.com map does? Thanks for the response, looks like I will utilize the way you spoke of.

Thanks,
Spencer

JakeSkinner · Answer

Hi Spencer,

You could use the setVisibleLayers method to query which layers to add.  You could apply transparency to the polygons, and display the other layers with no transparency.  Ex:
//transparency applied
var lyrUSA = new ArcGISDynamicMapServiceLayer("http://sampleserver6.arcgisonline.com/arcgis/rest/services/USA/MapServer", {
      opacity : 0.5
});

lyrUSA.setVisibleLayers([0,2]);    
map.addLayer(lyrUSA);

//no transparency
var lyrUSA2 = new ArcGISDynamicMapServiceLayer("http://sampleserver6.arcgisonline.com/arcgis/rest/services/USA/MapServer");

lyrUSA2.setVisibleLayers([1,3]);
map.addLayer(lyrUSA2);