Solución:
He leído esto y varias publicaciones en SE, que me indicaron la dirección correcta.
Tu enlace apunta a los documentos sobre mapbox.js
que es diferente de mapbox-gl.js
.
Documentos para Mapbox GL JS: https://www.mapbox.com/mapbox-gl-js/api/#popup
Hay un tutorial oficial de Mapbox que muestra también cómo diseñar una ventana emergente Mapbox GL JS usando CSS: https://www.mapbox.com/help/building-a-store-locator/
La siguiente captura de pantalla se toma a partir de ahí:
Mapbox GL JS:
Si necesita aún más control sobre el estilo de la ventana emergente (por ejemplo, establecer el color de fondo para diferentes tipos de ventanas emergentes), puede establecer un nombre de clase personalizado directamente en el nivel superior de la ventana emergente con:
JS:
new mapboxgl.Popup({ className: "apple-popup" })
new mapboxgl.Popup({ className: "banana-popup and-another-css-class" })
CSS:
/* change background and tip color to green */
.apple-popup .mapboxgl-popup-content {
background-color: green;
}
.apple-popup .mapboxgl-popup-tip {
border-top-color: green;
}
/* change background and tip color to yellow */
.banana-popup .mapboxgl-popup-content {
background-color: yellow;
}
.banana-popup .mapboxgl-popup-tip {
border-top-color: yellow;
}