Activate 2 layers

740
7
12-15-2016 03:53 AM
KonradPreuß
New Contributor

Dear Esri-Users,


the checkbox of our application activate 1 layer. I’m interested how to activate 2 layers with the same checkbox.


This is our application: http://gis.uba.de/website/luft/index.html .


The Checkbox (named as "Spots") is hidden, you can select "Schadtsoff" -> "Stickstoffdioxid" and choose a year. Look at the screenshot in the attachment please.


Thank you so much!


Best regards!


Konrad

------------------------------

Code-Snippets:

//(1)
// Featurelayer Spots NO2 2013
  SPno213 = new esri.layers.FeatureLayer("http://atlas-bp2:6080/arcgis/rest/services/Lu/WMS_UBA_Lu_OI_Spots_Test/MapServer/5" && "http://atlas-bp2:6080/arcgis/rest/services/Lu/WMS_UBA_Lu_OI_Spots_Test/MapServer/10", {
   mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
   id: "idSP_5",
   visible: true
  });

//(2)

if(selectJahr.value == 400)
    addOILayer(selectSchad,StickLayer00,StickLayer00I,SPno200,2000,4,16,30,44,checkBox,selectAuswert);
   else if(selectJahr.value == 401)
else if(selectJahr.value == 413)
    addOILayer(selectSchad,StickLayer13,StickLayer13I,SPno213,2013,3,12,21,32,checkBox,selectAuswert);

0 Kudos
7 Replies
RobertScheitlin__GISP
MVP Emeritus

Konrad,

   You can have a checkbox execute any code you choose on its click event or change event. So activating/adding two layer is no issue at all.

But:

SPno213 = new esri.layers.FeatureLayer("http://atlas-bp2:6080/arcgis/rest/services/Lu/WMS_UBA_Lu_OI_Spots_Test/MapServer/5" && "http://atlas-bp2:6080/arcgis/rest/services/Lu/WMS_UBA_Lu_OI_Spots_Test/MapServer/10", {
   mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
   id: "idSP_5",
   visible: true
  });

Is not going to work. The constructor for FeatureLayer is only expecting one layer url.

0 Kudos
KonradPreuß
New Contributor

Robert Scheitlin, GISP‌ thank you so much!

Which contructor should I use instead of "FeatureLayer"? Otherwhise I can create two variables like "SPno213a" and "SPno213b". But I don't know how to integrate them into the if-loop.

Thank you very much!

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

There is no layer type that will allow you to define two urls in the constructor. I would define two FeatureLayers and then in your checkbox change event handler you can trun both layers visibility to true.

0 Kudos
KonradPreuß
New Contributor

rscheitlin‌ thank you, I know what you mean. The problem is, I have no experience with the "event handler". Do you have a code-snippet for example?

Tank you so much.

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Here is a sample:

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>Feature Layer Only Map</title>
    <link rel="stylesheet" href="https://js.arcgis.com/3.18/esri/css/esri.css">
    <style>
        html,
        body,
        #map {
            height: 100%;
            width: 100%;
            margin: 0;
            padding: 0;
        }

        .shadow {
          -moz-border-radius: 6px;
          -webkit-border-radius: 6px;
          border-radius: 6px;
          background-color: #999999;
          padding: 8px;
        }

        #footer {
          height: 90px;
          width: 300px;
          margin: 0 auto;
          padding: 15px;
          position: absolute;
          bottom: 20px;
          left: 20px;
          z-index: 30;
        }
        #topic {
          font-weight: 600;
          font-size: 130%;
        }
    </style>
    <script src="https://js.arcgis.com/3.18/"></script>
    <script>
        //var fl, fl2
        require([
            "dojo/dom",
            "dojo/on",
            "esri/map",
            "esri/layers/FeatureLayer",
            "esri/geometry/Extent",
            "esri/InfoTemplate",
            "dojo/parser",
            "dijit/form/CheckBox",
            "dojo/domReady!"
        ], function(
            dom,
            on,
            Map,
            FeatureLayer,
            Extent,
            InfoTemplate,
            parser
        ) {
            parser.parse();
            var bounds = new Extent({
                "xmin": -16045622,
                "ymin": -811556,
                "xmax": 7297718,
                "ymax": 11142818,
                "spatialReference": {
                    "wkid": 102100
                }
            });

            var map = new Map("map", {
                extent: bounds
            });

            var url = "https://sampleserver6.arcgisonline.com/arcgis/rest/services/WorldTimeZones/MapServer/2";

            var template = new InfoTemplate("World Regions", "Region: ${REGION}");

            var fl = new FeatureLayer(url, {
                id: "world-regions",
                infoTemplate: template
            });

            var fl2 = new FeatureLayer("https://sampleserver6.arcgisonline.com/arcgis/rest/services/WorldTimeZones/MapServer/1", {
                id: "world-time zones"
            })

            map.addLayers([fl, fl2]);
            on(dom.byId("mycheck"), "change", function(evt){
              if(dom.byId("mycheck").checked){
                fl.setVisibility(true);
                fl2.setVisibility(true);
              }else{
                fl.setVisibility(false);
                fl2.setVisibility(false);
              }
            })
        });
    </script>
</head>

<body class="claro">
  <div id="map">
    <div id="footer" class="shadow">
      <span id='topic'>Toggle Layers</span><br><br>
      <div style="display: flex">
        <input id="mycheck" data-dojo-type="dijit/form/CheckBox" checked /> <label for="mycheck">World Layers Visibility</label>
      </div>
    </div>
  </div>
</body>

</html>
KonradPreuß
New Contributor

I've found a solution and now it works!  I'll post the solution here in the next days. Thank you so much rscheitlin‌ !

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Konrad,

   Did you not see the sample code I posted yesterday?

0 Kudos