Community

ImageService - Not being able to turn off

432
1
04-19-2012 06:41 AM
NipaParikh
by
New Contributor II
‎04-19-2012 06:41 AM
Hello,

I'm trying to add the imageservice when the user clicked on the checkbox and when the user unchecks the checkbox I would like to remove that layer.  Below is my code but it's not removing layer.

Can someone please take a look at it and let me know what's wrong.

function updateImageServiceVisibility() {
        var imageServiceName = "";
        
        if (selState == "Select") {
          alert("Please Select State to display the imageService");
          return;
        } else if (selState == "ESI_Alabama_Data") {
          imageServiceName = "ESI_Alabama_Maps"
        } else if (selState == "ESI_DE_NJ_PA_Data") {
          imageServiceName = "ESI_DE_NJ_PA_Maps"
        }
       
        var params = new esri.layers.ImageServiceParameters();
        params.noData = 0;
        params.format = "jpgpng";
        var imageServiceLayer = new esri.layers.ArcGISImageServiceLayer(serverName + "ArcGIS/rest/services/ESI/" + imageServiceName + "/ImageServer", {
          imageServiceParameters: params
        });
       
        if (dojo.byId("imageServicechkBox").checked) {
          map.addLayer(imageServiceLayer); 
         } else {
          imageServiceLayer.visible = false;
          map.removeLayer(imageServiceLayer);
        } 
      }

When I degug it does hit the else but removelayer is not happening.

Thanks for your help.

Nipa
0 Kudos
1 Reply
KellyHutchins
by Esri Frequent Contributor
Esri Frequent Contributor
‎04-19-2012 08:13 AM
I ran a quick test and can't reproduce using the code below. 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />
    <!--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>
      Simple Image Service
    </title>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/dojo/dijit/themes/claro/claro.css">
    <style>
      html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
    </style>
    <script type="text/javascript">
      var djConfig = {
        parseOnLoad: true
      };
    </script>
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.8">
    </script>
    <script type="text/javascript">
      dojo.require("dijit.layout.BorderContainer");
      dojo.require("dijit.layout.ContentPane");
      dojo.require("esri.map");
      var map;

      function init() {
        var initExtent = new esri.geometry.Extent({
          "xmin": -13409020.592351478,
          "ymin": 5800583.682038919,
          "xmax": -13259815.513138756,
          "ymax": 5885581.657492069,
          "spatialReference": {
            "wkid": 102100
          }
        });
        map = new esri.Map("map", {
          extent: initExtent
        });
        var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer");
        var params = new esri.layers.ImageServiceParameters();
        params.noData = 0;
        var imageServiceLayer = new esri.layers.ArcGISImageServiceLayer("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Portland/CascadeLandsat/ImageServer", {
            id:"cascadeLandsat",
          imageServiceParameters: params
        });
        map.addLayer(basemap);
        map.addLayer(imageServiceLayer);
        dojo.connect(map, 'onLoad', function(theMap) {
          //resize the map when the browser resizes
          dojo.connect(dijit.byId('map'), 'resize', map,map.resize);
        });
      }
      function removeLayer(){
        var imageLayer = map.getLayer('cascadeLandsat');
        map.removeLayer(imageLayer);
      }
     dojo.addOnLoad(init);
    </script>
  </head>
  
  <body class="claro">
    <div dojotype="dijit.layout.BorderContainer" design="headline" gutters="false"
    style="width: 100%; height: 100%; margin: 0;">
    <div dojotype='dijit.layout.ContentPane' region='top' style='height:20px;'>
        <input type='button' value='Click' onclick='removeLayer();'/>
    </div>
      <div id="map" dojotype="dijit.layout.ContentPane" region="center" style="overflow:hidden;">
      </div>
    </div>
  </body>

</html>
0 Kudos