turn map/feature services on and off

jaykapalczynski · ‎05-30-2014

Looking through the online Samples for ArcGIS JavaScript API for examples and documentation for turning on and off Map/Feature services I have in my application

Anyone help point me in the right direction.

Thanks

jaykapalczynski · ‎06-04-2014

Nope I am really confused...
As the check boxes are being created on the fly I am not understanding where I can apply the infoTemplate if the check box is checked...bit different than your example above....
I assume that it does not matter how many check boxes are checked rather that I am assigning the correct infoTemplate to the specific MapService index???
Really confused on this one.
Just need a little guidance to get me on the right path here.

http://jsfiddle.net/vCW8W/7/

KenBuja · ‎06-04-2014

This sample shows how to apply different InfoTemplates to features from different layers returned from an IdentifyTask.

jaykapalczynski · ‎06-05-2014

THanks Ken....I am seeing where you are going with this and think that its a good start....

First: In my app I have a Secured Service that requires Credentials, I have this set up to allow the user to select features that render after positive credential check. These results from the identify (only selects one feature at a time) are passed and displayed in a pane (not a popup) WORKING great

Second: In this same app I have a Map service that is not secured. If the user does not have credentials they can still enter the site and identify on other public features... It is here that I am trying to leverage the additional identify. I am bring in one map service and must distinguish between layers in order to identify and return results. But as in the First above I do not want a popup....I want the features to be displayed in a Pane off to the side.

Actually I think the First above is using a SELECT and the Second is using IDENTIFY

I tried to utilize that example you gave and send the results to the "LeftPane" defined in HTML

In the example Below I am simply trying to get the Map Service to Identify and send results to a pane not a popup

<!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>Identify with Popup</title>

    <link rel="stylesheet" href="https://js.arcgis.com/3.9/js/esri/css/esri.css">
    <style>
      html, body, #map {
        height:100%;
        width:100%;
        margin:0;
        padding:0;
      }

  /*---------------------------------------------------------------------------------------------------------*/
  /* NewLayer window in the top right corner*/

  .divLayerContainerNewLayer
  {
   position: absolute;
   top: 45px;
   right: 0px;
   width: 200px;
   z-index: 1000;
  }
  .divLayerHolderNewLayer
  {
   width: 190px;
   height: 400px;
   background: rgba(0,0,0,0.9);
   -pie-background: rgba(0,0,0,0.9);
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   border-radius: 5px;
   behavior: url("styles/PIE.htc");
   opacity:.8;
  }
  .divLayerContentHolderNewLayer
  {
   overflow: auto;
   padding: 5px;
   height: 390px;
   width: 185px;
  }
  #leftPane{
   background-color:transparent;
   border:1px solid red;
   font-family:tahoma;
   font-size:10px;
   height: 350px;
  }

    </style>

    <script src="https://js.arcgis.com/3.9/"></script>
    <script>
      var map;

      require([
        "esri/map",
        "esri/InfoTemplate",
        "esri/layers/ArcGISDynamicMapServiceLayer",
        "esri/symbols/SimpleFillSymbol",
        "esri/symbols/SimpleLineSymbol",
        "esri/tasks/IdentifyTask",
        "esri/tasks/IdentifyParameters",
        "esri/dijit/Popup",
        "dojo/_base/array",
        "esri/Color",
        "dojo/dom-construct",
        "dojo/domReady!"
      ], function (
        Map, InfoTemplate, ArcGISDynamicMapServiceLayer, SimpleFillSymbol,
        SimpleLineSymbol, IdentifyTask, IdentifyParameters, Popup,
        arrayUtils, Color, domConstruct
      ) {

        var identifyTask, identifyParams;
/*
        var popup = new Popup({
          fillSymbol: new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,
            new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
              new Color([255, 0, 0]), 2), new Color([255, 255, 0, 0.25]))
        }, domConstruct.create("div"));
*/
        map = new Map("map", {
          basemap: "gray",
          center: [-77.4329, 37.5410],
          zoom: 7
         // infoWindow: popup
        });

        map.on("load", mapReady);

        var parcelsURL = "https://fwisweb1.dgif.virginia.gov/arcgis/rest/services/Public/DGIF_Public/MapServer";
        map.addLayer(new ArcGISDynamicMapServiceLayer(parcelsURL,
          { opacity: .55 }));

        function mapReady () {
          map.on("click", executeIdentifyTask);
          //create identify tasks and setup parameters
          identifyTask = new IdentifyTask(parcelsURL);

          identifyParams = new IdentifyParameters();
          identifyParams.tolerance = 3;
          identifyParams.returnGeometry = true;
          identifyParams.layerIds = [0, 4];
          identifyParams.layerOption = IdentifyParameters.LAYER_OPTION_ALL;
          identifyParams.width = map.width;
          identifyParams.height = map.height;
        }

        function executeIdentifyTask (event) {
          identifyParams.geometry = event.mapPoint;
          identifyParams.mapExtent = map.extent;

          var deferred = identifyTask
            .execute(identifyParams)
            .addCallback(function (response) {
              // response is an array of identify result objects
              // Let's return an array of features.
              return arrayUtils.map(response, function (result) {
                var feature = result.feature;
                var layerName = result.layerName;

                feature.attributes.layerName = layerName;
                if (layerName === 'Birding Trail Sites') {
                  var taxParcelTemplate = new InfoTemplate("",
                    "${LOOP_NAME} <br/> Owner of record: ${SITE_NAME}");
                  feature.setInfoTemplate(taxParcelTemplate);
                }
                else if (layerName === 'Birding Trail Loops') {
                  console.log(feature.attributes.PARCELID);
                  var buildingFootprintTemplate = new InfoTemplate("",
                    "Parcel ID: ${Loop_Name}");
                  feature.setInfoTemplate(buildingFootprintTemplate);
                }
                return feature;
              });
            });

          // InfoWindow expects an array of features from each deferred
          // object that you pass. If the response from the task execution
          // above is not an array of features, then you need to add a callback
          // like the one above to post-process the response and return an
          // array of features.

          //map.infoWindow.setFeatures([deferred]);
   //map.infoWindow.show(event.mapPoint);


 
        var popup = map.infoWindow;

 connect.connect(popup, "onSelectionChange", function(){
  displayPopupContent(popup.getSelectedFeature());
 });

 //When features are associated with the map's info window update the sidebar with the new content.
 connect.connect(popup, "onSetFeatures", function(){
   displayPopupContent(popup.getSelectedFeature());
  });
         

        }  // END OF executeIdentifyTask


    function displayPopupContent(feature){
       if(feature){
           var content = feature.getContent();
           registry.byId("leftPane").set("content", content);
       }
    }



      });
    </script>
  </head>

  <body>
    <div id="map">

     <div id="divLayerContainerNewLayer" class="divLayerContainerNewLayer hideContainerHeightNewLayer" >
  <div id="divLayerHolderNewLayer" class="divLayerHolderNewLayer">
   <div id="divLayerContainerHolderNewLayer" style="position: relative">
    <div id="divLayerContentHolderNewLayer" class="divLayerContentHolderNewLayer" style="position: absolute;
       overflow: hidden">

   <div id="leftPane" data-dojo-type="dijit/layout/ContentPane"
       data-dojo-props="region:'center'">
      </div>

    </div>
   </div>
  </div>
 </div>

    </div>
  </body>

</html>

jaykapalczynski · ‎06-05-2014

Please see Previous post first...

This is how I am passing the selected feature to the "LeftPane" currently.....So looking to morph this code and the one in your example to allow the user to select on the Secured Service and Unsecured Service. I assume keeping the code separate and passing to different Content Panes

Need to get this to a side container of some sort because in the first instance above I have the popupWindow set to false

app.map.infoWindow.set("popupWindow", false);

Thoughts? Appreciated.

Can I combine and select any of the features in my map below with the code below?

    function initializeSidebar(map){

        var popup = map.infoWindow;

        //when the selection changes update the side panel to display the popup info for the
        //currently selected feature.
        connect.connect(popup, "onSelectionChange", function(){
            displayPopupContent(popup.getSelectedFeature());
        });

        //when the selection is cleared remove the popup content from the side panel.
        connect.connect(popup, "onClearFeatures", function(){
           dom.byId("featureCount").innerHTML = "Click Identify Tool to select feature(s)";
           registry.byId("leftPane").set("content", "");
           domUtils.hide(dom.byId("pager"));
        });

        //When features are associated with the map's info window update the sidebar with the new content.
        connect.connect(popup, "onSetFeatures", function(){
           displayPopupContent(popup.getSelectedFeature());
           dom.byId("featureCount").innerHTML = popup.features.length + " feature(s) selected";

           //enable navigation if more than one feature is selected
           popup.features.length > 1 ? domUtils.show(dom.byId("pager")) : domUtils.hide(dom.byId("pager"));
         });
    }

    function displayPopupContent(feature){
       if(feature){
           var content = feature.getContent();
           registry.byId("leftPane").set("content", content);
       }
    }

    function selectPrevious(){
       app.map.infoWindow.selectPrevious();
    }

    function selectNext(){
       app.map.infoWindow.selectNext();
    }

    function clearContent() {
       registry.byId("leftPane").set("content", "");
       domUtils.hide(dom.byId("pager"));
    }