Prepopulated shapes in Azure map drawing module

Shak Imran 21 Reputation points
2020-11-12T07:16:21.707+00:00

I am trying to add drawing module to Azure map and it's working fine. I am following this tutorial:

https://azuremapscodesamples.azurewebsites.net/Drawing%20Tools%20Module/Add%20drawing%20toolbar%20to%20map.html

But what I additionally need is load drawing module with existing shapes. There is a way to pass data source but it's working. here is my sample code:

var datasource = new atlas.source.DataSource();

                        datasource.add(new atlas.Shape(new atlas.data.Polygon([
                            [
                                [
                                    18.070557117463295,
                                    59.33577767221689
                                ],
                                [
                                    18.068754673004065,
                                    59.33386797094337
                                ],
                                [
                                    18.07420492172281,
                                    59.33307998268603
                                ],
                                [
                                    18.074247837067247,
                                    59.33459027745769
                                ],
                                [
                                    18.070557117463295,
                                    59.33577767221689
                                ]
                            ]
                        ])));

                        var dManager=new atlas.drawing.DrawingManager(this.Map, {
                            toolbar: new atlas.control.DrawingToolbar({ position: 'top-right', style: 'light' }),
                            source: _datasource                            
                        });
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

1 answer

Sort by: Most helpful
Most helpful Newest Oldest
  1. rbrundritt 16,456 Reputation points Microsoft Employee
    2020-11-12T17:36:08.743+00:00

    You can add a shape to the data source in the drawing tools by doing this: 

    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);

    There isn't an official method yet to programmatically place this shape into edit mode, but it can be achieved by doing the following: 

    drawingManager.editHelper.edit(shape)

    If you used the method above to programmatically put a shape into edit mode 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()

    Fully support for this scenario is planned to be added to the drawing tools this spring.

    0 comments