azure drawing-tools module default selected shape to edit

Aydin Itil 166 Reputation points
2020-11-02T05:06:30.797+00:00

My question is regarding azure-maps-drawing-tools and making polygon dragHandles visible without requiring a user click.

I add a square to the draw manager's polygon layer by default to give the user a starting polygon to edit using the draggable handles. This is working for me but I would like to have the dragHandle and the secondaryDragHandle be visible by default without requiring a user click for them to display. Any ideas on how to achieve this?

Azure Maps
Azure Maps
An Azure service that provides geospatial APIs to add maps, spatial analytics, and mobility solutions to apps.
653 questions
0 comments
Accepted answer
  1. Aydin Itil 166 Reputation points
    2020-11-02T22:06:48.8+00:00

    Thanks for the answer. I am unable to get that to work. I have done the following and the shape's drag handles are still not showing up. 

    var dataSource = drawingManager.getSource()
  var shape = new atlas.data.Feature(
    new atlas.data.Polygon([[
        [-73.98235, 40.76799],
        [-73.95785, 40.80044],
        [-73.94928, 40.7968],
        [-73.97317, 40.76437],
        [-73.98235, 40.76799]
    ]])
  )
  dataSource.add(shape);
  drawingManager.editHelper.edit(shape)

    Also, wasn't sure If I should ask in a separate question, I noticed none of the drawing tool events subscribe to a shape being modified. Is there any async way to detect when a shape has been edited. The only way I can think of to overcome this is add manual mouse events and extract shape data from the dataSource.

1 additional answer

Sort by: Most helpful
Most helpful Newest Oldest
  1. rbrundritt 16,456 Reputation points Microsoft Employee
    2020-11-02T16:09:08.49+00:00

    This isn't officially supported yet, updates to the drawing tools are planned for the first half of 2021. That said, here is an undocumented way to do this that seems to work well: 

    //Some random shape.
var shape = ....

//Check to see if the shape is in the drawing manager. If not, add it.
var tempShape = drawingManager.getSource().getShapeById(shape.getId());

if(!tempShape){
    drawingManager.getSource().add(shape);
}

//Put the shape into edit mode (undocumented/unsupported method).
drawingManager.editHelper.edit(shape);

    When you are done and want to stop editting, the ESC button won't work as the edit mode wasn't initiated as normal. To complete the edit, you can call the following undocumented method. You could even add a key press event handler on the map in the previous code block to add back support for ESC. 

    drawingManager.editHelper.finish()
    1 person found this answer helpful.