LayerDrawingOptions and transparency

1625
6
12-20-2012 04:02 PM
ChrisGarrard
New Contributor III
I have a map service with multiple layers, but I would like some of the layers to draw semi-transparent. I set the transparency in the mxd, and the REST endpoint reports the default transparency values, but the layers draw completely opaque (although the color doesn't match the legend-- it's like it's lightening the color instead of making it semi-transparent). So I thought I'd try using a LayerDrawingOptions object. Using that, I can change the renderer, but changing the transparency property has no effect. And kind of like before, changing the alpha value for the symbol color in the renderer changes the color but not the transparency. The only way I've been able to get any transparency is to set it when I create the ArcGISDynamicMapServiceLayer, but that changes the transparency of all layers in the map service, which is not what I want.

I know I could just create a different ArcGISDynamicMapServiceLayer for each layer in the service, but if I have to do that, what's the point of the LayerDrawingOptions? And why isn't ArcGIS Server using the default transparency for a layer by default?

Thanks!
Chris
6 Replies
RichardGwozdz
New Contributor
Chris -

Did you ever resolve this?  We are having this exact same problem...have tried javascript api 3.3 and 3.4.  Can't set transparency for individual layers.

Rich
0 Kudos
RichardGwozdz
New Contributor
Chris -

We just figured out what the problems was for us.  Image format needs to be png32; we had it original set to png24.

Rich
0 Kudos
jasonwriter
New Contributor III

Hi Chris,

I am having the same issue with trying to set transparency for an individual layer within a dynamic map service even after I set the image format to png32.

Do you think you might be able to show me your relevant code that you got working? Here is my failed attempt:

baseAll = new ArcGISDynamicMapServiceLayer(urlBaseAll, {});

          baseAll.id = "baseAll";

          //set up drawing options to make species range transparent

          var optionsArray = [];

          var drawingOptions = new LayerDrawingOptions();

          drawingOptions.transparency = 60;

          optionsArray[8] = drawingOptions;

          baseAll.setImageFormat('png32');

          baseAll.setLayerDrawingOptions(optionsArray);

Any help would be greatly appreciated.

Thanks.

Jason

0 Kudos
ChrisGarrard
New Contributor III

Hi Jason,

I would, except I honestly don't remember if I ever got it to work and no

longer have the services I was playing with running. If I remember right, I

was putting together a proof-of-concept for something, but it didn't end up

going anywhere. I've been working on completely unrelated (and funded)

projects ever since and haven't gotten back to anything related to ArcGIS

Server. Sorry about that!

Chris

0 Kudos
jasonwriter
New Contributor III

No problem. I got it figured out. Thank you for responding.

0 Kudos
BillBrodie1
New Contributor

I had same issue and concur with the solution: setting the imageFormat to 'png32' was the key issue.  My service was returning 'png8' images by default - which does not seem to support transparency for this API.  Below is my code.

// Code is TypeScripty

// Specified map service has 4 layers
this.myDataLayer = new ArcGISDynamicMapServiceLayer(`${mapServiceUrl}${mapServicePath}/MapServer/`, { "visible": true, "id": "My_Data"} );

let layerDrawingOptions: LayerDrawingOptions[]= [];

let drawingOption2 = new LayerDrawingOptions();

// Set 10 percent transparency for layers 0 and 1
drawingOption2.transparency = 10;
layerDrawingOptions[0] = drawingOption2;
layerDrawingOptions[1] = drawingOption2;

// Set 50 percent transparency for layers 2 and 3
let drawingOption = new LayerDrawingOptions();
drawingOption.transparency = 50;
layerDrawingOptions[2] = drawingOption;
layerDrawingOptions[3] = drawingOption;

this.myDataLayer.setLayerDrawingOptions(layerDrawingOptions);

// The following line is required or transparency setting does not work! Default 'png8' does not support transparency.
this.myDataLayer.setImageFormat("png32");

this.map.addLayer(this.myDataLayer);

0 Kudos