Sketch Widget Disable Reshape

1472
4
Jump to solution
04-23-2020 01:55 AM
JoelGoransson
New Contributor II

Hi everyone, novice programmer here tasked with making a project, I'm a little out of my depth. I'm using this plugin to allow a user to select a basic rectangular area on a map, I found that the Sketch widget is pretty much exactly what I need.

There is a sample of it here: Sketch widget | ArcGIS API for JavaScript 4.15 

As I only want a basic rectangle I wanted to disable the other options of drawing, I found I could do this with this "availableCreateTools: ["rectangle"]" code but now I still have the issue of the reshape tool being able to modify the rectangle into complex shapes, and the transform tool being able to rotate the rectangle (which I do not want either).

How can I disable both of these behaviors? (Most importantly the reshape one first).

Please see my code pen here: https://codepen.io/issun/pen/BaopmQV?editors=1010 

Thanks in advance for all your answers!

UPDATE 1: Figured out how to disable rotation, by adding the line "sketch.defaultUpdateOptions.enableRotation = false;" before adding sketch to the view. Now I just need help with disabling the reshape tool

Tags (2)
0 Kudos
1 Solution

Accepted Solutions
RobertScheitlin__GISP
MVP Emeritus

Joel,

   So Add this css rule to prevent the reshape button from showing.

button[title="Reshape"]{
  display: none;
}

View solution in original post

4 Replies
RobertScheitlin__GISP
MVP Emeritus

Joel,

  Sure just add this:

defaultUpdateOptions: {enableRotation: false, toggleToolOnClick: false}
JoelGoransson
New Contributor II

Thanks Robert, this is much better than me adding a line after the constructor, but the "toggleToolOnClick" property does not disable the reshape tool, it only disables switching between the transform and reshape tools when clicking more than once on a created shape.

I've updated my codepen with the changes you suggested, see here: https://codepen.io/issun/pen/BaopmQV?editors=1010 

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Joel,

   So Add this css rule to prevent the reshape button from showing.

button[title="Reshape"]{
  display: none;
}
JoelGoransson
New Contributor II

Ah thank you Robert, using this (hiding the button) combined with the above defaultUpdateOptions: {toggleOnClick: false} so the user cannot switch to that tool by double clicking, disables it completely, solved my problem, cheers

0 Kudos