Tile layer and style

Maps SDK for Web (JavaScript)
#1

can we try different layer settings while retrieving TomTom map tiles to show more information on map.
For example, i want to try layer = “hybrid” or “poi” instead of “basic”:

I am using custom style give some color’s to the map and code looks like below:

const  map = tt.map({
            container: maprefcontiner
            key: constants.mapKey,
            style: ttMapStyle (this is a json style file which  stored in my folder)
        })
#2

That is how this should work.
ttMapStyle should be a JSON object. So if you have the style in a file, then you need to load it first.
Or just use URL of the hosted style file.

#3

how can i change tile from basic to hybrid or poi

when I check the map tile related api calls in browser network tab, all are aligned with basic. I want to change it to hybrid.

eg: https://d.api.tomtom.com/map/2/tile/**basic**/3/0/3.pbf?key=

#4

It is defined in the style file.
Open it in Map Styler, then go to Data sources, where you can find URLs for Vector Tiles that can be modified

#5

I can see 4 urls and If i change all urls from basic to hybrid or poi, then I am getting yellow screen and all the styles were gone
can you suggest what are the errors in below urls:
https://a.api.tomtom.com/map/2/tile/poi/{z}/{x}/{y}.pbf?key=
https://b.api.tomtom.com/map/2/tile/poi/{z}/{x}/{y}.pbf?key=
https://c.api.tomtom.com/map/2/tile/poi/{z}/{x}/{y}.pbf?key=
https://d.api.tomtom.com/map/2/tile/poi/{z}/{x}/{y}.pbf?key=