Configuration Example - Layers

In the Configure Network Maps app, Mapbox’s Layer styling can be used. To configure a layer using the Layout JSON and Paint JSON fields, please refer to the Mapbox Layers Style SpecificationInformation published on non-SAP site.

Some of these styling fields can be used with the standard Visual Business renderer but its library does not support all layer properties. Where it is not supported, default Visual Business styling will be applied to the configured map.

Network Spatial Service Source Type
Field Name Value Expected Result

Name

Other Object's Point

 

Description

Shows objects on the map that are not the current object displayed in the parent app (for example, shows all work orders other than the Work Order displayed in the AIN Work Order’s Geometry tab)

 

Type

Circle

Mandates use of a Point geometry

Source Type

Network Spatial Service

 

Service URL

/odata/v4/userspatialservice/BusinessObjects?$filter=not (appReferenceObjectId in ({{id}}))&$expand=geometries($filter=geometryType eq 'ST_Point')

Filters the OData service to retrieve and visualize all of point geometries of the map’s nominated business object type (for example, work order) that do not have the current business object’s ID

Layout JSON

   

Paint JSON

{"circle-color": "#67869b", "circle-blur": 0.5, "circle-stroke-width": 1}

Will set point’s colour, fade/shadow (that is, blur) and outline width.

Custom Source JSON

   

Attribution

   

JSON Config

   
Custom Source Type
Field Name Value Expected Result

Name

USA Weather (Live Update)

 

Description

Live weather data from the National Oceanic and Atmospheric Administration

 

Type

Raster

Mandates use of a raster image

Source Type

Custom Source

 

Service URL

   

Layout JSON

   

Paint JSON

{"raster-opacity": 0.85}

Will set Raster image to an 85% transparency

Custom Source JSON

{"type":"raster","tiles":["https://idpgis.ncep.noaa.gov/arcgis/rest/services/radar/radar_base_reflectivity_time/ImageServer/exportImage?bbox={bbox-epsg-3857}&size=256,256&format=jpgpng&transparent=true&bboxSR=3857&imageSR=3857&f=image"],"tileSize":256}

Will retrieve Raster image from the publicly available NOAA URL, then set the bounding box, transparent ability, format and size.

Attribution

   

JSON Config

   
GeoJSON Source Type
Field Name Value Expected Result

Name

World Airports

 

Description

World Airports

 

Type

Symbol

Mandates use of a symbol/icon

Source Type

GeoJSON

 

Service URL

https://raw.githubusercontent.com/jplim/geojson-data/master/world-airport.geojson

URL for GeoJSON data source

Layout JSON

{"icon-image": "airport-15"}

Sets icon image

Paint JSON

{"text-color": "#ffff99"}

Can use HTML-style hex values, RGB, RGBA, HSL, and HSLA colour formats. Predefined HTML colour names (for example, ‘yellow’, ‘blue’) are also permitted.

Custom Source JSON

   

Attribution

   

JSON Config

   
Conditional GeoJSON Source Type
Field Name Value Expected Result

Name

World Airports - Conditional formatting

 

Description

World Airports using different colours based on a country code condition

 

Type

Circle

Mandates use of a Point geometry

Source Type

GeoJSON

 

Service URL

https://raw.githubusercontent.com/jplim/geojson-data/master/world-airport.geojson

URL for GeoJSON data source

Layout JSON

   

Paint JSON

{"circle-stroke-width": 1, "circle-color": ["match", ["get", "country_code"], "CN", "#ffff99", "US", "blue", "AU", "red", "#67869b"]}

Sets thickness of a point outline and, depending on the data provided in the GeoJSON layer (that is, country_code), the layer’s geometries are ‘painted’ in different colours (for example, US airport geometries will be blue, whereas Australia airports will be red).

Custom Source JSON

   

Attribution

   

JSON Config