''use of "text-field" requires a style "glyphs" property' when using a plain background

I'm using a plain background, rather than using a MapBox style, as per this answer

var map = new mapboxgl.Map({
    container: 'map',
    style: {
      version: 8,
      sources: {},
      layers: [
        {
          id: 'background',
          type: 'background',
          paint: {'background-color': 'white'}
        }
      ]
    }
});

I've added a GeoJSON point layer and I'm trying to label it:

'layout': {
  'text-field': ['get', 'name'],
  'text-font': ['Open Sans Semibold', 'Arial Unicode MS Bold'],
},

If I use a standard MapBox style for the map, the layer is correctly labelled. But if I use the aforementioned blank basemap, this layer returns the error:

use of "text-field" requires a style "glyphs" property

Searching this error message shows that I need to add a glyphs option:

"glyphs":"mapbox://fonts/mapbox/{fontstack}/{range}.pbf" or "glyphs":"https://fonts.openmaptiles.org/{fontstack}/{range}.pbf"

However, neither of these options prevents the error message, and the layer is not labelled.

What is the correct syntax for the glyphs parameter when using an empty basemap?



Solution 1:[1]

As a workaround, I created a new Blank style in MapBox Studio and used that as the basemap. After this, the labels appeared correctly.

enter image description here

var map = new mapboxgl.Map({
  style: mapbox://styles/my-blank-map,
  ...
})

I'd still like to know if there's a programmatic way to do this using the MapBox GL-JS API though.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Stephen Lead