topic Re: Pause or Resume Draw or DrawAction, or Add Vertices to Draw or DrawAction Programmatically in ArcGIS JavaScript Maps SDK Questions

Pause or Resume Draw or DrawAction, or Add Vertices to Draw or DrawAction Programmatically

GaryLSheppardJr — Mon, 18 Apr 2022 18:01:45 GMT

I'm using the Draw class to let the user draw different kinds of graphics on the map. The Draw polyline sample works really well. Now I would like to let the user pause drawing and then resume the in-progress drawing. Is this possible using the Draw class?

I don't see anything on Draw or DrawAction that would let me pause and resume, which would be exactly what I want. What about cancelling the drawing, saving the vertices in memory, and then adding those vertices to a new Draw or DrawAction? Is that possible, and if so, how is it done?

This is similar to my previous question about doing something similar with SketchViewModel. This new question is about Draw as opposed to SketchViewModel.

Re: Pause or Resume Draw or DrawAction, or Add Vertices to Draw or DrawAction Programmatically

TristanMorrison — Thu, 21 Apr 2022 00:58:10 GMT

What about cancelling the drawing, saving the vertices in memory, and then adding those vertices to a new Draw or DrawAction? Is that possible, and if so, how is it done?

I think that, using this approach, you will be able to achieve what you're going for. The first part of this scenario — starting a drawing operation and then "pausing" it — will be fairly straightforward. You will start the DrawAction as normal. The UI for the "pause" action will be up to you, but as far as JS API components are concerned, you will simply call the complete() method of either the Draw or the DrawAction. Note that, unlike in the higher-level context of SketchViewModel, there is not a specific method to "cancel" the operation, but that's only because, in the lower-level context of Draw, where the API components are not adding any graphics to the view for you, there wouldn't really be a difference between "completing" and "canceling."

The second part — "resuming" the drawing operation — is less straightforward, but still able to be done cleanly and without having to resort to any convoluted or hacky code. I have made a sample in CodePen showing how it can be done. Basically, you don't have to do anything special when you create the second DrawAction; it never needs to know that you already had some vertices when you began. What's different is that, when you create/update the graphic that represents the user's drawing, you create the geometry using your initial vertices plus (concatenated with) the vertices from the DrawAction event.

The CodePen sample is a modified version of the Draw polyline sample that you mentioned. I modified it to demonstrate how, given four existing vertices, a PolylineDrawAction can be used to "continue drawing" that polyline — i.e. to draw a polyline with the first four vertices already defined. I also stripped out all code from the original sample related to checking for self-intersection. I've explained more in comments in the code, but I've also left most of the comments from the original. You can distinguish mine because they start with // TM:

Let me know if this approach works for you, and/or if you need any clarification of the sample.

Re: Pause or Resume Draw or DrawAction, or Add Vertices to Draw or DrawAction Programmatically

GaryLSheppardJr — Thu, 21 Apr 2022 01:37:40 GMT

Thank you, Tristan. That is a good approach that gets me 90% of the way there. The only thing left to do is figure out how to let the user double-click the last point immediately after resuming. If the user single-clicks at least one point and then double-clicks a point, it's fine. But if the user double-clicks without single-clicking any points, a vertex is added but the drawing continues. If you have any ideas for solving that, let me know. Thanks again!

Re: Pause or Resume Draw or DrawAction, or Add Vertices to Draw or DrawAction Programmatically

GaryLSheppardJr — Fri, 22 Apr 2022 18:51:20 GMT

I have a fix for that double-click behavior for polylines. Once I get it working for polygons too, I'll share what I did. Thanks again for the head start!

Re: Pause or Resume Draw or DrawAction, or Add Vertices to Draw or DrawAction Programmatically

AngelaSuffia — Thu, 01 Feb 2024 19:31:00 GMT

Gary, I came across this post as I am having the same issue when resuming a polyline drawing. I know some time has passed, but I am very curious how you were able to solve the double-click problem. Do you still have a copy of your code you can share? Thanks in advance!