Azure Maps : Select which layers are loaded for a style

Question

I am trying to select which layers are loaded when a map style is selected, and am unable to locate documentation on how to accomplish this. My client is loading a 2019-10-16.json file which has a layerGroups property with an array of layerPath objects for the style. Is there a way I can modify the configuration in the file to not load the "transit.json" layer? I have included one of the style configurations from the 2019-10-16.json file.

{
            "name": "road",
            "theme": "light",
            "glyphsPath": "styles/glyphs/{fontstack}/{range}.pbf",
            "spritePath": "styles/sprites/road/2018-05-31/sprite",
            "iconPath": "styles/thumbnails/road/2018-06-21.png",
            "copyright": ["©2020 TomTom"],
            "layerGroups": [{
                    "name": "base",
                    "layerPath": "styles/layers/road/2019-10-16/base.json"
                }, {
                    "name": "transit",
                    "layerPath": "styles/layers/road/2019-10-16/transit.json"
                }, {
                    "name": "labels",
                    "layerPath": "styles/layers/road/2019-10-16/labels.json"
                }, {
                    "name": "buildings",
                    "layerPath": "styles/layers/road/2019-10-16/buildings.json"
                }, {
                    "name": "labels_places",
                    "layerPath": "styles/layers/road/2019-10-16/labels_places.json"
                }
            ],
            "flowPaths": {
                "absolute": "styles/layers/road/2018-05-17/flow/absolute.json",
                "relative": "styles/layers/road/2018-05-17/flow/relative.json",
                "relative-delay": "styles/layers/road/2018-05-17/flow/relative-delay.json"
            }
        }

Answer 1

Custom styling of the base map is not yet supported, but planned for the future.

I would avoid trying to do anything around modifying that file as it is likely to break (we plan on revamping how base map styles are structured in the SDK soon).

That said, there it is possible to do custom styling today in a supported way. It is a bit more work.

1. You can use this with the blank or blank_accessible map styles to
2. A fully supported method is to create an instance of the VectorTileSource class and load in the base map tiles directly:

datasource = new atlas.source.VectorTileSource(null, {
tiles: ['https://{azMapsDomain}/map/tile?api-version=2.0&tilesetId=microsoft.base&zoom={zoom}&x={x}&y={y}')],
maxZoom: 22
});

The cool thing here is the {azMapsDomain} placeholder will tell the map control to align the domain of the request to the same one specified in the map control. This makes it easy to create code the works in both the public and government cloud versions of Azure Maps. It also provides the helpful task of taking care of authentication for you.

3. Once you have a vector tile source, you can then use this with rendering layers (i.e. LineLayer). However you will need to specify the sourceLayer option of the layer to tell it which data in the vector tile to render. The list of source layers can be found here: https://developer.tomtom.com/maps-api/maps-api-documentation-vector/tile From there, you can use the rendering layer like any of the code samples.

This works well for simple styles, but for complex styles, it would be a lot of work, thus why we haven't yet released official support for custom styling.

Here are some samples that use the vector tile traffic data: https://azuremapscodesamples.azurewebsites.net/index.html#Vector-tiles