topic Re: vertices remain on clear graphics in ArcGIS JavaScript Maps SDK Questions

vertices remain on clear graphics

rsharma — Fri, 08 May 2020 11:08:40 GMT

My polygon vertices remain when i remove graphics.

My polygons come from db, as well i created new polygons on the spot.

While one of many polygon coming from db always stay editable and one of new polygon created always remain editablle.

the one editable polygon always leave its vertices on removal, even when i used sketchViewModel.complete();

I tried alot , but didn't get it how to get it fixed.

Any help will be appriceable.

//Clear All method

jQuery('#main').on('click', '.clear_all', function(){
      //clear all graphics added to graphics layer
      clearAll=true;
      sketchViewModel.complete();
      graphicsLayer.removeAll();

});

//Double click to delete boundaries
           view.on("double-click", function(event){
              view.hitTest(event).then(function(response) {
                var results = response.results;
                 sketchViewModel.complete();
               results.forEach(function(result) {
                if(result.graphic.geometry.type==='polygon'&&result.graphic.layer === sketchViewModel.layer && result.graphic.attributes && result.graphic.attributes.newDevelopment){
                   graphicsLayer.remove(result.graphic);
                 }
                });
              });
           });

For making them editable, i use this code below

view.when(function() {

       // Listen to sketchViewModel's update event to do graphic reshape validation
          sketchViewModel.on(["update", "undo", "redo"], onGraphicUpdate);

          //now the graphic has been added to the graphics layer and the SketchviewMdoel is created
          //to show it as editable when page load
        sketchViewModel.update([newDevelopmentGraphic], {tool: "reshape"});
        });//End View.When

      function onGraphicUpdate(event) {
          // get the graphic as it is being updated
          const graphic = event.graphics[0];
          // check if the update event's the toolEventInfo.type is move then stop move event
          if (event.toolEventInfo && event.toolEventInfo.type.includes("move")){
              sketchViewModel.cancel();
              markersketchViewModel.cancel();
            }
            // If toolEventInfo.type is reshape-stop then it means user finished moving or reshaping the graphic, call complete method. This will change update event state to complete and we will check the validity of the graphic location.
          if (
            event.toolEventInfo &&
            (event.toolEventInfo.type === "move-stop" ||
              event.toolEventInfo.type === "reshape-stop")
          ) {
              sketchViewModel.complete();
            markersketchViewModel.complete();
          } else if (event.state === "cancel" || event.state === "complete") {
            //check if the graphics are done being reshaped, printout updated graphic's geometry and reshape stage.
            // graphic reshaping has been completed or cancelled
              graphic.attributes.state = "updated";
              sketchViewModel.update([graphic], { tool: "reshape" });
          }
       else{
         graphic.symbol = validSymbol;
        }
        }//End OnGraphicsUpdate

// This function is called when a user clicks on the view.
        function setUpGraphicClickHandler() {
          view.on("click", function(event) {
            view.hitTest(event).then(function(response) {
              var results = response.results;
            if(results.length === 0){
              sketchViewModel.complete();
               markersketchViewModel.complete();
            }
              // Check if the new development graphic and temp graphics with attribute named newDevelopment was clicked and pass
              // the graphic to sketchViewModel.update() with reshape tool.
              results.forEach(function(result) {
                if (
                  result.graphic.layer === sketchViewModel.layer &&
                  result.graphic.attributes &&
                  result.graphic.attributes.newDevelopment
                ) {
                  sketchViewModel.update([result.graphic], { tool: "reshape" });
                }
                else if(sketchViewModel.state !== 'active'){
                  sketchViewModel.cancel();
                  view.popup.open({features: [result.graphic], location: result.graphic.geometry});
                }
              });
            });
          });
        }//End setUpGraphicClickHandler

Re: vertices remain on clear graphics

RobertScheitlin__GISP — Sun, 12 Dec 2021 03:42:46 GMT

Rajni,

This is what you need (tested on my end).

      //Double click to delete  boundaries
      view.on("double-click", function (event) {
        //Prevent map from zooming in initially
        event.preventDefault();
        event.stopPropagation();
        var gRemoved = false;
        view.hitTest(event).then(function (response) {
          var results = response.results;
          sketchViewModel.complete();
          results.forEach(function (result) {
            if (result.graphic.geometry.type === 'polygon' && result.graphic.layer === sketchViewModel
              .layer && result.graphic.attributes && result.graphic.attributes.newDevelopment) {
              graphicsLayer.remove(result.graphic);
              gRemoved = true;
            }
          });
          sketchViewModel.cancel();
          //if a graphic was not deleted then zoom in as normal
          if (!gRemoved){
            var pnt  = new Point({x: event.mapPoint.x, y: event.mapPoint.y, spatialReference: view.spatialReference});
            view.goTo({target: pnt, scale: (view.scale * .5)});
          }
        });
      });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: vertices remain on clear graphics

rsharma — Tue, 12 May 2020 12:33:47 GMT

Sir

Still m not able to resolve this issue,

your help will be very thankful

Re: vertices remain on clear graphics

RobertScheitlin__GISP — Tue, 12 May 2020 13:11:54 GMT

Rajni,

When I put the double click event in the code that I have for you it works. So I am not sure what is wrong on your end. I am not sure also why you commented out a line of code that I provided in my working example.

///event.preventDefault();

Re: vertices remain on clear graphics

rsharma — Thu, 14 May 2020 12:38:18 GMT

i commented this line bcz it gives error on using ///event.preventDefault();

Also my polygons comes on click, from db and as well as i get them by drawing them manually.

So the polygon comes from db always remain editable.

polygon drawn from tool become editable one at a time,

while polygon onclick of view become editable one at a time with drawn polygon including

1 polygon from db always remain editable (while other drawn and onclick on view out of these 2 only one polygon editable at a time).

I think their is great need to rectify this thing

Re: vertices remain on clear graphics

rsharma — Fri, 15 May 2020 08:03:51 GMT

Hi Sir,

I solved the problem as below code, i removed the bolded lines, and its working fine now.

No need to complete their state and no need to reshape them again. they will remain in their basic state that is one editable at a time.