Select to view content in your preferred language

Help setting opacity/transparency of Basemap

3283
2
06-04-2014 03:36 PM
TaitRounsaville1
Emerging Contributor
Hi,

I am completely new to JS and am trying to find a way to dim the esri basemap under my layers. So far the basemap is loaded/called like this: (I think)

map = new Map("map", {
        basemap: "satellite",
        center: [-117.719, 34.100],
        zoom: 14,
      });

I have searched through the forums and JS API developers site trying different methods I am finding but either I am writing the code wrong or have not found the correct format to make this work.

Any suggestions?


Thanks,

Tait
0 Kudos
2 Replies
OwenEarley
Frequent Contributor
See this example: http://jsbin.com/hehihima

The key is to add the basemap layer the old way as an ArcGISTiledMapServiceLayer:

    var map, baseLyr;
    require(["esri/map", "esri/layers/ArcGISTiledMapServiceLayer", "dojo/domReady!"], function(Map,ArcGISTiledMapServiceLayer) {
      
      // create map
      map = new Map("mapDiv", {
        center: [-117.719, 34.100],
        zoom: 14
      });
     
      // add basemap with 50% opacity
      baseLyr = new ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer", {opacity:0.5});
      map.addLayer(baseLyr);
            
    });


Hope this helps.

Owen
www.spatialxp.com.au
0 Kudos
ManishkumarPatel
Deactivated User
Hi Tait,

Owen suggestion is one way of doing it. Alternatively you can also try setting the opacity as below:

    
var lyrOpac = map.getLayer(map.getLayer[0]); //assuming your the layer is at 0 index.
lyrOpac.setOpacity(0.5);


This can also help to set the opacity for any layer you want just need to set the specific index for that layer.

for further details please refer to the below link:

https://developers.arcgis.com/javascript/jsapi/layer-amd.html#setopacity


Hope this helps.

Regards,
Manish
0 Kudos