AnsweredAssumed Answered

Select ArcGISdynamiclayer by unique IDs to modify opacity

Question asked by AlexSabrina on Nov 18, 2014
Latest reply on Nov 19, 2014 by AlexSabrina

Hi all,

I am trying to create an opacity control button that would allow users to modify opacity for each layer within an ArcGIS dynamic layer (for instance layer0, layer1, layer3). I have a script that runs fine for the whole  ArcGISDynamicLayer:

<!DOCTYPE html>  
<html>  
  
<head>  
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
  <!--The viewport meta tag is used to improve the presentation and behavior of the samples     
      on iOS devices-->  
  <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">  
  <title>Explicitly Create Map Service Layer List</title>  
  <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/themes/smoothness/jquery-ui.css" />  
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">  
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">  
  <link rel="stylesheet" href="http://js.arcgis.com/3.11/dijit/themes/claro/claro.css">  
  <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css">  
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>  
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>  
  <script src="http://js.arcgis.com/3.11/"></script>  
  <script>  
    var map;  
    require([  
        "esri/map",  
        "esri/layers/ArcGISDynamicMapServiceLayer",  
        "esri/layers/ImageParameters",  
        "dojo/dom",  
        "dojo/on",  
        "dojo/query",  
        "dojo/domReady!"  
      ],  
      function (Map, ArcGISDynamicMapServiceLayer, ImageParameters, dom, on, query) {  
        var layer, visibleLayerIds = [];  
  
        map = new Map("map");  
  
        //Use the ImageParameters to set the visibleLayerIds layers in the map service during ArcGISDynamicMapServiceLayer construction.    
        var imageParameters = new ImageParameters();  
        imageParameters.layerIds = [2];  
        imageParameters.layerOption = ImageParameters.LAYER_OPTION_SHOW;
        
       
  
        layer = new ArcGISDynamicMapServiceLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer", {  
          "imageParameters": imageParameters
        });  
        map.addLayer(layer);  
  
        on(dom.byId("opacity"), "click", updateOpacity); 


        function updateOpacity() {  
          var cOp = layer.opacity;  
          console.info(cOp);  
          if (cOp < 0.9999999999999999) {  
            layer.setOpacity(cOp + 0.1);  
          } else {  
            layer.setOpacity(0.1);  
          }  
        } 
    
      });  
  </script>  
</head>  
  
<body>  
  This sample loads an ArcGISDynamicMapServiceLayer and presents a button to adjust the map services opacity.  
  <br />  
  <br />Layer List :  
  <button type="button" class="btn btn-default btn-xs" title="Adjust opacity" id="opacity"><span class="glyphicon glyphicon-adjust"></span>  
  </button>
  <button type="button" class="btn btn-default btn-xs" title="Adjust opacity" id="opacity2"><span class="glyphicon glyphicon-adjust"></span>  
  </button>
  <br />  
  <br />  
  <div id="map" class="claro" style="width:600px; height:400px; border:1px solid #000;"></div>  
</body>  
  
</html>  

 

 

Any ideas are welcome,

Thank you,

Alex

Outcomes