how to add background color for layer text field in mapbox-gl

Question

how to add a background color for layer text-field in mapbox-gl.. or how it can be done so that there's background box on the text-field

map.addLayer({
    "id": "markers",
    "type": "symbol",
    "source": "markers",
    "layout": {
        "icon-image": "{marker-symbol}-15",
        "text-field": "{title}",
        "text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"],
        "text-offset": [0, 0.6],
        "text-anchor": "top"
    }
});

Answer 1

While I also don't know how to draw a background box, we may be looking for the same thing which is to obscure any other text beneath the custom label so that it pops and is more legible. If so, I did discover that you can add a "halo" which will achieve the desired effect.

"layout": {
                "icon-image": symbol + "-15",
                "icon-allow-overlap": true,
                "text-field": symbol,
                "text-font": ["Open Sans Bold", "Arial Unicode MS Bold"],
                "text-size": 11,
                "text-transform": "uppercase",
                "text-letter-spacing": 0.05,
                "text-offset": [0, 1.5]
            },
            "paint": {
                "text-color": "#202",
                "text-halo-color": "#fff",
                "text-halo-width": 2
            },

This was taken from this example on their site.