ArcGIS JS Api - Getting information on the drawn shape while preventing moving

Question

I am trying to find out how a user can draw a shape, and on click get the information on the shape they drew, without transforming and moving it around.

I've managed to get sketch up and running and drawing working.

However even disabling all the options when user clicks on it it still allows moving of shape, and i don't know how to get details of the shape (particularly points of the shape so i can store it for future drawing).

Here is what i have so far

LaurenBoyd · Answer

Hi @Aeseir,

Thanks for elaborating on what you are trying to achieve! It seems that you may want to set the SketchViewModel's defaultUpdateOptions tool parameter to null. This should disable any update functionality since there is no tool to update graphics.

sketchVM.defaultUpdateOptions.tool = null;

I added this in my code and it no longer allows updates: https://codepen.io/laurenb14/pen/GRMmKMo?editors=1000

Thanks,

Lauren

Aeseir · Answer

Hi @LaurenBoyd

Thanks for the additional insights.  I was able to replicate the hit mechanism after digging a bit deeper into event documentation so that has been nailed, thanks for reinforcing the finding.

The remainder problem is that user can still move the shape after they have drawn it, how do i prevent them moving the shape. In your example is the same issue, i can draw the shape and still drag it around the map.

I have previously disabled scaling, rotation, transformation and toolOnClick as you can see.

LaurenBoyd · Answer

Hi @Aeseir !

It seems that you're wanting to disable the rotation on update of the graphic that was drawn via the Sketch widget so that you can create your own hitTest to access that graphic information. You can disable rotation by setting the following SketchViewModel properties to "false":

* updateOnGraphicClick
* defaultUpdateOptions.enableRotation
* defaultUpdateOptions.toggleToolOnClick

Then create a hitTest on the view so that you can access the graphic that was drawn:

view.on("click", (event) => {
        // only include graphics from graphics layer in the hitTest
        const opts = {
          include: graphicsLayer
        }
        view.hitTest(event, opts).then((response) => {
          // check if a feature is returned from the graphicslayer
          if (response.results.length) {
            const graphic = response.results[0].graphic;
            // do something with the graphic
            console.log(graphic);
          }
        });
    });

Check out this sample I put together that combines the above: https://codepen.io/laurenb14/pen/GRMmKMo?editors=1000

This doesn't disable the rotation on the graphic creation but disables it for any updates. Hope this helps!

Thanks,
Lauren