Navigation :

autoDrawConfiguration

autoDrawConfiguration Property

Description

This property is used to apply Auto Draw configurations to the editor from the host application, which is responsible to persist or generate this data as desired.

Use the set method of the AutoSceneDrawWeb object as illustrated below to set the value of this property. Note that this will overwrite any existing Auto Draw configuration but will not change the existing diagram.

Auto Draw queries the configured data source for map geometry data within the bounding box of the currently active view or the visible screen area if the entire diagram is active. This data is used to generate shapes which are then added to the diagram.

The example below illustrates the usage of the pre-configured Auto Draw schemes.

Example

editor = new window.__editor(undefined, document.getElementById('editor-node'));

editor.startup(...);

editor.set('autoDrawConfiguration', {
    dataSources: [
        {
            schemeId: 'OSM',
            displayName: 'OSM Public Server'
        },
        {
            schemeId: 'OSM',
            displayName: 'OSM No Sidewalks',
            options: {
                overpassEndpoint: 'https://myoverpassapi.example.com/api/interpreter',
                failoverUrls: [
                    'https://someotherserver.example.com/api/interpreter',
                    'https://yetanotherserver.example.com/api/interpreter'
                ],
                maxStreetCount: 200,
                tagMap: {
                    emergency: {
                        'fire_hydrant': 'Fire_Hydrant'
                    },
                    railway: {
                        'rail': 'Railroad_Tracks'
                    }
                }
            }
        },
        {
            schemeId: 'VectorTile',
            displayName: 'ESRI Vector Tile World BaseMap'
        },
        {
            schemeId: 'VectorTile',
            displayName: 'ESRI Vector Tile OSM',
            options: {
                mapURL: 'https://basemaps.arcgis.com/arcgis/rest/services/OpenStreetMap_v2/VectorTileServer',
                maxStreetCount: 200,
                 layerMap: {
                    streets: [
                        {
                            layer: 'road'
                        }
                    ],
                    symbols: [
                        {
                            layer: 'tree',
                            symbolName: 'Tree_1'
                        }
                    ],
                    linearSymbols: [
                        {
                            layer: 'railway',
                            symbolName: 'Railroad_Tracks'
                        },
                        {
                            layer: 'path',
                            symbolName: 'Sidewalk'
                        }
                    ],
                    shapes: [],
                    crosswalks: [],
                    structures: [
                        {
                            layer: 'OSM building'
                        },
                        {
                            layer: 'Daylight building'
                        },
                        {
                            layer: 'OSM major building'
                        }
                    ],
                    textShapes: [
                        {
                            layer: 'OSM building/label'
                        },
                        {
                            layer: 'OSM address area/label'
                        },
                        {
                            layer: 'road/label'
                        }
                    ]
                }
            }
        }
    ]
});

OSM

In its default configuration, the OpenStreetMap scheme queries the public OpenStreetMap Overpass API server at overpass-api.de.

Like the GIS configuration, schemeId indicates the type and displayName sets the text that will identify it in the UI. All the options are optional.

overpassEndpoint specifies an alternative or self-hosted Overpass API endpoint. See here for instructions on setting up a self-hosted server.

failoverUrls specifies an array of Overpass API endpoints to try if a request to the current one fails. This defaults to two public servers, overpass-api.de and overpass.private.coffee. Set this option to an empty array to disable failover.

maxStreetCount specifies the maximum allowed number of streets before an error is thrown. The default is 200.

tagMap maps the tag names returned from the server to ASD symbols. The server will return data similar to this:

{
  "type": "node",
  "id": 8197337618,
  "lat": 43.6157743,
  "lon": -116.2017970,
  "tags": {
    "emergency": "fire_hydrant"
  }
},

In the default configuration, the tagMap is as follows:

emergency: {
    'fire_hydrant': 'Fire_Hydrant'
},
footway: {
    'sidewalk': 'Sidewalk'
},
railway: {
    'rail': 'Railroad_Tracks'
}

The format being:

tagName: {
    'tag value': 'symbol name'
}

include contains options for including certain shapes:

{
    schemeId: 'OSM',
    displayName: 'OSM Buildings Only',
    options: {
        tagMap: {
            // empty tagMap overrides default
        },
        include: {
            streets: true, 
            structures: false
        }
    }
}

Default options are:

    streets: true,
    streetLabels: true,
    structures: true,
    structureLabels: true,
    symbols: true,
    parking: false,
    crosswalks: true

VectorTile

The VectorTile scheme works similarly to the OSM scheme but downloads the appropriate vector map tiles from a supported map service and parses them to obtain geometry data. Vector tiles are in a binary format that is parsed and rendered by the browser on the fly to display a map. The default configuration uses ESRI Vector Tile World Basemap. The other example above shows it configured to use the ESRI Vector Tile Basemap based on OpenStreetMap data. Vector tiles are stored in layers rather than the tag structure of OSM. Each layer generally contains a specific type of shape. The options include a mapURL which can be used to specify an alternate map server and layerMap which is used to match the layers to the specific shapes:

shapeType: [
    {
        layer: 'name of layer',
        symbolName: 'symbol name if applicable'
        condition: // see below
    },
    ...
],
nextShapeType: [
    ...
],
...

The default configuration is as follows:

layerMap: {
    streets: [
        {
            layer: 'Road',
            condition: 
            {
                field: '_symbol',
                operator: 'not',
                value: 9
            }
        }],
    shapes: [],
    linearSymbols: [
        {
            layer: 'Road',
            condition: 
            {
                field: '_symbol',
                operator: 'is',
                value: 9
            },
            symbolName: 'Sidewalk'
        }
    ],
    crosswalks: [],
    structures: [
        {
            layer: 'Building'
        }
    ],
    textShapes: [
        {
            layer: 'Building/label'
        }, 
        {
            layer: 'Road/label'
        }
    ]
},

The condition option has been added for fine-tuning. In the example above, the map data uses the field ‘_symbol’ to indicate which style should be applied to the line in the rendered map. In this case a value of 9 indicates a sidewalk rather than a street so we want to filter those out in the streets list and specifically include them in the linear symbols list using the symbol named ‘Sidewalk’.