What kind of object does SketchViewModel("draw-complete") event.gemetry return?

MichaelThornton — Tue, 28 Jan 2020 17:57:14 GMT

I want to use a geometry object from an esriRequest to add a graphic to a featureLayer. I present the client with two options: 1.) use the SketchViewModel draw tool to create a polygon to add a new graphic to the featureLayer, and 2.) use a dropdown box selector to choose a specific Field Office boundary polygon to add a new graphic to the featureLayer. While the draw tool works fine, when I obtain my geometry object from the esriRequest it will not display when I later go to that record and attempt to display the geometry on my web map.

// GraphicsLayer to hold graphics created via sketch view model
var tempGraphicsLayer = new GraphicsLayer();

   const featureLayer = new FeatureLayer({
          url:
            "https://gis.nm.blm.doi.net/arcgis/rest/services/Stipulations/BLM_NM_OG_Stips_Poly/FeatureServer/0/addFeatures"
        });

           // Point to the rss feed url
      var layer = new MapImageLayer({
    url: "https://gis.blm.gov/nmarcgis/rest/services/Base/BLM_NM_Reference_Boundaries/MapServer"
  });

        var map = new Map({
          basemap: "national-geographic",
          layers: [layer, tempGraphicsLayer]
        });

        var view = new MapView({
          container: "viewDiv",
          map: map,
          zoom: 6,
          center: [-106.1499021874988, 34.44280009376313]
        });

      view.when(function() {
        // create a new sketch view model
        var sketchViewModel = new SketchViewModel({
          view: view,
          layer: tempGraphicsLayer,
          pointSymbol: { // symbol used for points
            type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
            style: "circle",
            color: "#72ACCB",
            size: "16px",
            outline: { // autocasts as new SimpleLineSymbol()
              color: [255, 255, 255],
              width: 3 // points
            }
          },
          polylineSymbol: { // symbol used for polylines
            type: "simple-line", // autocasts as new SimpleMarkerSymbol()
            color: "#72ACCB",
            width: "4",
            style: "dash"
          },
          polygonSymbol: { // symbol used for polygons
            type: "simple-fill", // autocasts as new SimpleMarkerSymbol()
            color: "rgba(114,172,203, 0.7)",
            style: "solid",
            outline: {
              color: "white",
              width: 1
            }
          }
        });

        // ************************************************************
        // Get the completed graphic from the event and add it to view.
        // This event fires when user presses
        // * "C" key to finish sketching point, polygon or polyline.
        // * Double-clicks to finish sketching polyline or polygon.
        // * Clicks to finish sketching a point geometry.
        // ***********************************************************




        sketchViewModel.on("draw-complete", function(evt) {

//console.log("evtGeo", evt.geometry) ;
    geometryForSketch = evt.geometry;
    document.getElementById('GISGeometry').value = 'Geometry Input';
      // add the graphic to the graphics layer
            tempGraphicsLayer.add(evt.graphic);
            setActiveButton();

        });

        // Call FeatureLayer.applyEdits() with specified params.
        function applyEditsToIncidents(params) {
          // unselectFeature();
          featureLayer
            .applyEdits(params)
   .then(function(){

   unloadLoadingGif();
     window.location.href = "http://it4rmdev.blm.doi.net/Michaels_Leasing_Stipulations_Proof_11_25_2019/StipPages/stipulationsList.cfm";
    })
            .catch(function(error) {
     unloadLoadingGif();
              console.log("===============================================");
              console.error(
                "[ applyEdits ] FAILURE: ",
                error.code,
                error.name,
                error.message
              );
              console.log("error = ", error);
            });
        }
        // *************************************
        // activate the sketch to create a point
        // *************************************




   var submitButton = document.getElementById("submitButton");

submitButton.onclick = function() {

   
   var fOSelectVal = document.getElementById('fieldOfficeShp').options[ document.getElementById('fieldOfficeShp').selectedIndex ].value;
   




   loadLoadingGif('/Settings/Images/Loading.gif');

if(fOSelectVal == ' ' )
   {

     geometryObj = geometryForSketch;
     console.log("geo", geometryObj);
   }
   else
   {

      
    if(fOSelectVal == "Las Cruces District Office"){
     var Clause = "ADMU_NAME = 'LAS CRUCES DISTRICT OFFICE'"
    }
    else if(fOSelectVal == "Carlsbad Field Office"){
     var Clause = "ADMU_NAME = 'CARLSBAD FIELD OFFICE'"
    }
    else if(fOSelectVal == "Socorro Field Office"){
     var Clause = "ADMU_NAME = 'SOCORRO FIELD OFFICE'"
    }
    else if(fOSelectVal == "Roswell Field Office"){
     var Clause = "ADMU_NAME = 'ROSWELL FIELD OFFICE'"
    }
    else if(fOSelectVal == "Rio Puerco Field Office"){
     var Clause = "ADMU_NAME = 'RIO PUERCO FIELD OFFICE'"
    }
    else if(fOSelectVal == "Taos Field Office"){
     var Clause = "ADMU_NAME = 'TAOS FIELD OFFICE'"
    }
    else if(fOSelectVal == "Farmington Field Office"){
     var Clause = "ADMU_NAME = 'FARMINGTON FIELD OFFICE'"
    }
    else if(fOSelectVal == "Oklahoma Field Office"){
     var Clause = "ADMU_NAME = 'OKLAHOMA FIELD OFFICE'"
    }
    

    
    require(["esri/request"], function(esriRequest) {

      /************************************************
       *
       * Define the 'options' for our request.
       *
       *************************************************/

var options = {
     // These properties will be appended to the request URL in the following format:
     // <url>?f=json
     query: {
      f: "json",
     geometryType: "esriGeometryPolygon",
     where: Clause,
     geometryPrecision: 3,
     outSR: 3857

     },
     // Determine the format you want to read the response as.
     // Default type is 'json'. Other values are 'xml', 'text', 'blob', 'arraybuffer', 'document'.
     responseType: "json"
     };

var url = "https://gis.blm.gov/nmarcgis/rest/services/Base/BLM_NM_Reference_Boundaries/MapServer/0/query";

esriRequest(url, options).then(
       function(response)
       {

unloadLoadingGif();
geometryObj= response.data.features[0].geometry.rings;
        document.getElementById('GISGeometry').value = 'Geometry Input';
        
        console.log("geo3", geometryObj);

       });
    });
       }

     var Res = document.getElementById('optResource');
     var Stat = document.getElementById('optStatus');
     var Type = document.getElementById('optType');
     var AdmFldOff = document.getElementById('optFO');
     var RMPA = document.getElementById('optRMPA');
     var Dsgntn = document.getElementById('optDsgntn');
     var ROD_Yr = document.getElementById('optROD_Yr');
     var State = document.getElementById('optState');
     var AdmState = document.getElementById('optAdminState');
     var DataSrc = document.getElementById('optDataSrc');
//build geometry object to add
  var polygon = Polygon({
        f: json,
        type: "polygon", // autocasts as new Polygon()
        rings: geometryObj,
        spatialReference: {"latestWkid":3857,"wkid":102100 }
         });

    editFeature = new Graphic({

    geometry: polygon,
    attributes: {

OG_STIP_ID: document.getElementById('txtStipID').value,
      OG_STIP_NA: document.getElementById('txtTitle').value,
      OG_STIP_TYPE: Type.options[Type.selectedIndex].value,
      OG_STIP_CNTNT: document.getElementById('txtDescript').value,
      PRPSE: document.getElementById('txtPurpose').value,
      PRCDNG_RMP_RMPA: RMPA.options[RMPA.selectedIndex].value,
      AFFCTED_RESRCE: Res.options[Res.selectedIndex].value,
      STATUS: Stat.options[Stat.selectedIndex].value,
      DSGNTN: Dsgntn.options[Dsgntn.selectedIndex].value,
      GEO_STATE: State.options[State.selectedIndex].value,
      ADMIN_ST: AdmState.options[AdmState.selectedIndex].value,
      ADM_UNIT_CD: AdmFldOff.options[AdmFldOff.selectedIndex].value,
      ROD_YR: ROD_Yr.options[ROD_Yr.selectedIndex].value,
      SITE_NA: document.getElementById('txtSite').value,
      DATA_SRCE: DataSrc.options[DataSrc.selectedIndex].value,
      GEN_COMMENTS: document.getElementById('txtGenComm').value,
      WAIVER: document.getElementById('txtWaiver').value,
      EXCPTN: document.getElementById('txtException').value,
      MODFCTN: document.getElementById('txtModif').value

}

});

      const edits = {
     addFeatures: [editFeature]
      };

applyEditsToIncidents(edits);

};

   // ***************************************
   // activate the sketch to create a polygon
   // ***************************************
   var drawPolygonButton = document.getElementById("polygonButton");

   drawPolygonButton.onclick = function() {
     // set the sketch to create a polygon geometry
     tempGraphicsLayer.removeAll();
     sketchViewModel.reset();
     document.getElementById('GISGeometry').value = '';
     sketchViewModel.create("polygon");
     setActiveButton(this);
   };

   // **************
   // reset button
   // **************
   document.getElementById("resetBtn").onclick = function() {
     tempGraphicsLayer.removeAll();
     sketchViewModel.reset();
     document.getElementById('GISGeometry').value = '';
     setActiveButton();
   };

});

</script>

Re: What kind of object does SketchViewModel("draw-complete") event.gemetry return?

RobertScheitlin__GISP — Tue, 28 Jan 2020 18:12:07 GMT

Michael,

Since version 4.10 the event is called create, not draw-complete.

sketchViewModel.on("create", function(event) {‍

https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Sketch-SketchViewModel.html#events-summary

Re: What kind of object does SketchViewModel("draw-complete") event.gemetry return?

KenBuja — Sun, 12 Dec 2021 00:03:39 GMT

One problem I immediately see is that your function arguments don't match up with your require modules. You left out the SpatialReference argument (if that's even needed)

require([
     "esri/Map",
     "esri/views/MapView",
     "esri/widgets/Sketch/SketchViewModel",
     "esri/Graphic",
     "esri/layers/GraphicsLayer",
     "esri/layers/GeoRSSLayer",
     "esri/layers/FeatureLayer",
     "esri/layers/MapImageLayer",
     "esri/geometry/SpatialReference",
     "esri/geometry/Polygon",
     "dojo/domReady!"
    ], function(Map, MapView, SketchViewModel, Graphic, GraphicsLayer, GeoRSSLayer, FeatureLayer, MapImageLayer, SpatialReference, Polygon) {‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: What kind of object does SketchViewModel("draw-complete") event.gemetry return?

MichaelThornton — Tue, 28 Jan 2020 18:37:10 GMT

Ken Buja, I don't think it is needed. I have since taken it out. My response is given in the correct spatial reference. I do not know if I need to declare it within the object I am putting in as the geometry object into applyEdits(); my problem is I am unable to find out, so far, exactly what parameters and what sort of object applyEdits() needs to add a geometry. I do know that sketchViewModel.on("draw-complete", function(evt) { geometryForSketch = evt.geometry; }); gives me the correct object, while my geometryObj = response.data.features[0].geometry.rings[0]; or geometryObj = response.data.features[0].geometry.rings; geometryObj = response.data.features[0].geometry; does not give me what I need.

Re: What kind of object does SketchViewModel("draw-complete") event.gemetry return?

RobertScheitlin__GISP — Tue, 28 Jan 2020 18:57:10 GMT

Michael,

applyEdits is looking for

const edits = {
addFeatures: [editFeature]
};

addFeatures is an array of graphics.

topic Re: What kind of object does SketchViewModel("draw-complete") event.gemetry return? in ArcGIS JavaScript Maps SDK Questions

What kind of object does SketchViewModel("draw-complete") event.gemetry return?

Re: What kind of object does SketchViewModel("draw-complete") event.gemetry return?

Re: What kind of object does SketchViewModel("draw-complete") event.gemetry return?

Re: What kind of object does SketchViewModel("draw-complete") event.gemetry return?

Re: What kind of object does SketchViewModel("draw-complete") event.gemetry return?