How can I capture attribute values in a variable?

4412
6
Jump to solution
03-11-2015 12:25 PM
HaskettGeorge
New Contributor III

I have a simple map built using the latest version of JavaScript API.

The map is initially opened by passing parameters, thus allowing the map to open in the desired area.  The end user will then pan and zoom to the precise area in question and click on the map.  Upon releasing the mouse, I would like to capture various attribute data associated to where that click interests a certain layer.  I have managed to capture the Lat and Long coordinates, and can display the desired values within the default popup window.  However I need to properly access the attribute of the layer in question and capture these values in a variable.  The variables will then be used to create a JSON object that another application consumes.

What is the best way to go about this?  Do I get the information from my popup window for my feature layer, is there an object already associated with the popup, or do I somehow use a different approach?

Any help would be greatly appreciated.

Thanks,

0 Kudos
1 Solution

Accepted Solutions
GeorgeHaskett
Occasional Contributor III

Okay, here is the solution I came up with.  Thought I should post it seeing how many people have looked at this thread.  It may not be the cleanest out there, but it works.  I tried to clean it up in word before copying and pasting it so the tabs may be a bit out of whack...

      

/// Listen for Click Events
map.on("load", function() {
          map.on("click", showCoordinates);
});


function showCoordinates(evt) {
          /// Project Map Coords (web mercator) in geographic (lat, long)
          var mp = webMercatorUtils.webMercatorToGeographic(evt.mapPoint);


          var pt_x = mp.x.toFixed(5);
          var pt_y = mp.y.toFixed(5);
          var longLat = pt_x + ", " + pt_y;
          var fdName = null;
          var rFire = null;
          var pcCF = null;
          var pcDE = null;
          if(evt.graphic)
          {
  pcDE = evt.graphic.attributes.PC_DE;
  fdName = evt.graphic.attributes.FD_NAME;
  rFire = evt.graphic.attributes.RESPONDING_FS;
  pcCF = evt.graphic.attributes.PC_CF;
          }
          else{
  alert("Oops, your point did not register.  Please try again.");
  return;
          }
                
           console.log("Print PC DE: ", pcDE);
           console.log("Print PC CF: ", pcCF);

           map.graphics.clear();
           var ptClick = esri.geometry.geographicToWebMercator(new esri.geometry.Point(pt_x, pt_y));
           var ptClickSMS = new PictureMarkerSymbol(
          'http://static.arcgis.com/images/Symbols/Basic/WhiteFlag.png',
          35,
          35
           );


           var font = new Font(
                        "12pt",
                        Font.STYLE_NORMAL,
                        Font.VARIANT_NORMAL,
                        Font.WEIGHT_BOLD,
                        "Calibri"
           );


           var textSymbol = new TextSymbol(
                        longLat,
                        font,
                        new Color("#000000")
           );
           textSymbol.setOffset(80,12);


           var ptGraphic = new esri.Graphic(ptClick, ptClickSMS);
           map.graphics.add(ptGraphic);
           map.graphics.add(new Graphic(ptClick));
           // map.graphics.add(new Graphic(ptClick, textSymbol));


           /// JSON Object ///
           var pcObj = {"nLong":pt_x, "nLat":pt_y, "nPC_DE": pcDE, "nPC_CF": pcCF, "nFD": fdName, "nFS": rFire};
           // Call to Send PC JSON Object
           sendData(pcObj);


          /// Display JSON Object on Screen via Info Text in Lower LeftHand Corner
         var pcValues = "Long/Lat = " + pcObj.nLong + ", " + pcObj.nLat + " | PC (PERS): " + pcObj.nPC_DE + ", PC (COMM): " + pcObj.nPC_CF + " | FD: " + pcObj.nFD + ", FS: " + pcObj.nFS;
         dom.byId("info").innerHTML = pcValues;
}

View solution in original post

0 Kudos
6 Replies
MahtabAlam1
Occasional Contributor

You can think of using IdentifyTask to get the feature and read it's attribute to formulate the required json. For example if we take sample ArcGIS API for JavaScript Sandbox

It can be modified to get the attribute information as json.

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


          var deferred = identifyTask
            .execute(identifyParams)
            .addCallback(function (response) {
  //get the attributes json - will require mdofication to handle multiple feature at a point
  var attributeJson = response[0].feature.attributes;
            });
        }

HTH

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

George,

  You can use

var attrObj = map.infoWindow.getSelectedFeature().attributes;

HaskettGeorge
New Contributor III

Any chance I could get a little more meat with this bone...

I am currently using InfoWindowLite, do I need to change everything to the Infowindow?

Any chance you have an example of this working?

Thanks,

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

George,

   Nope no sample to share. The code snippet is based on the fact that the JS maps infoWindow object uses a Popup dijit by default and it has a getSelectedFeature function.

0 Kudos
HaskettGeorge
New Contributor III

Okay, so I should replace my InfoWindowLite with the InfoWindow and go from there.

I'll give it a go, thanks.

0 Kudos
GeorgeHaskett
Occasional Contributor III

Okay, here is the solution I came up with.  Thought I should post it seeing how many people have looked at this thread.  It may not be the cleanest out there, but it works.  I tried to clean it up in word before copying and pasting it so the tabs may be a bit out of whack...

      

/// Listen for Click Events
map.on("load", function() {
          map.on("click", showCoordinates);
});


function showCoordinates(evt) {
          /// Project Map Coords (web mercator) in geographic (lat, long)
          var mp = webMercatorUtils.webMercatorToGeographic(evt.mapPoint);


          var pt_x = mp.x.toFixed(5);
          var pt_y = mp.y.toFixed(5);
          var longLat = pt_x + ", " + pt_y;
          var fdName = null;
          var rFire = null;
          var pcCF = null;
          var pcDE = null;
          if(evt.graphic)
          {
  pcDE = evt.graphic.attributes.PC_DE;
  fdName = evt.graphic.attributes.FD_NAME;
  rFire = evt.graphic.attributes.RESPONDING_FS;
  pcCF = evt.graphic.attributes.PC_CF;
          }
          else{
  alert("Oops, your point did not register.  Please try again.");
  return;
          }
                
           console.log("Print PC DE: ", pcDE);
           console.log("Print PC CF: ", pcCF);

           map.graphics.clear();
           var ptClick = esri.geometry.geographicToWebMercator(new esri.geometry.Point(pt_x, pt_y));
           var ptClickSMS = new PictureMarkerSymbol(
          'http://static.arcgis.com/images/Symbols/Basic/WhiteFlag.png',
          35,
          35
           );


           var font = new Font(
                        "12pt",
                        Font.STYLE_NORMAL,
                        Font.VARIANT_NORMAL,
                        Font.WEIGHT_BOLD,
                        "Calibri"
           );


           var textSymbol = new TextSymbol(
                        longLat,
                        font,
                        new Color("#000000")
           );
           textSymbol.setOffset(80,12);


           var ptGraphic = new esri.Graphic(ptClick, ptClickSMS);
           map.graphics.add(ptGraphic);
           map.graphics.add(new Graphic(ptClick));
           // map.graphics.add(new Graphic(ptClick, textSymbol));


           /// JSON Object ///
           var pcObj = {"nLong":pt_x, "nLat":pt_y, "nPC_DE": pcDE, "nPC_CF": pcCF, "nFD": fdName, "nFS": rFire};
           // Call to Send PC JSON Object
           sendData(pcObj);


          /// Display JSON Object on Screen via Info Text in Lower LeftHand Corner
         var pcValues = "Long/Lat = " + pcObj.nLong + ", " + pcObj.nLat + " | PC (PERS): " + pcObj.nPC_DE + ", PC (COMM): " + pcObj.nPC_CF + " | FD: " + pcObj.nFD + ", FS: " + pcObj.nFS;
         dom.byId("info").innerHTML = pcValues;
}
0 Kudos