SketchWidget and SketchViewModel

MichaelLodes2 — Sat, 11 Dec 2021 09:20:55 GMT

I am trying to have two different tools that can be used by pressing different buttons. The first is the standard sketch widget. The second is using the sketchViewModel (different variable name and different layer) to let the user update the geometry of features. When i first use the sketch Widget everything works fine but when i use my "moveTool" it somehow interacts with the sketch Widget. Then when clicking drawn shapes it won't highlight them and therefor u can't delete them anymore. Am i missing something here? Below i try to put the relevant code parts:

Sketch Widget:

const sketchViewModelDraw = new SketchViewModel({
 view,
 updateOnGraphicClick: true,
 dafaultUpdateOptions: {
     toggleToolOnClick: true
 }
});  
             
const sketchDraw = new Sketch({
    layer: sketchLayer,
    view: view,
    container: document.createElement("div"),
    layout: "vertical",
    sketchViewModel: sketchViewModelDraw
  }); 

on(dom.byId("btnGeometry"),"click", function(){
   view.ui.add(sketchDraw.container, "top-right");
   view.ui.add(finishBtn,"bottom-right");
   editExpand.expanded=false;
});‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Move Tool:

const moveGraphicsLayer = new GraphicsLayer({
     id:"moveGraphics",
     listMode:"hide",
     title: "moveGraphicsLayer"
 });
map.add(moveGraphicsLayer);
const moveSymbol = {
    type:"simple-marker",
    color: [255,255,0,0.4],
    size: "20px",
    outline: {
      color: "blue",
      width: "2px"
    },
    style: "circle"
};  
const sketchViewModelMove = new SketchViewModel({
 view,
 layer: moveGraphicsLayer,
//    pointSymbol: moveSymbol,
 updatePointSymbol: moveSymbol,
 updateOnGraphicClick: false,
 dafaultUpdateOptions: {
     toggleToolOnClick: true
 }
});  



 view.hitTest(moveEvent).then(function(response2){
          clickMove.style.display = "none";
          moveEvent.stopPropagation();
          console.log(response2);


         var results2 = response2.results;
         if (results2.length > 0) {
             var i;

             for (i = 0; i < results2.length; i++){

                 moveIndicator.style.display="block";
                  moveGraphic = results2[0].graphic;
                  moveGraphicsLayer.graphics.removeAll();
                  moveGraphicsLayer.graphics.add(moveGraphic);

                  sketchViewModelMove.update(moveGraphic, {tool: "move"});

             }
         } 
         else {
             moveIndicator.style.display="none";

         }
     });


            on(moveSaveBtn,"click", function(){

                removeArrowsButtons();

               let params =  {updateFeatures: [moveGraphic]};
               view.goTo({
                        center: moveGraphic.geometry
                      });

               lyr.applyEdits(params).then(function(editsResult){

                   const resultId = editsResult.updateFeatureResults[0].objectId;


                       console.log("Object ID updated.. "+ resultId);
                       console.log("Lat "+ moveGraphic.geometry.latitude);
                       console.log("Lon "+ moveGraphic.geometry.longitude);
               });

                 moveGraphicsLayer.graphics.removeAll();
                 sketchViewModelMove.complete();
                 clickMove.style.display = "block";

           });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Thanks for any help.

topic SketchWidget and SketchViewModel in ArcGIS JavaScript Maps SDK Questions

SketchWidget and SketchViewModel