How to use data-driven styling on text-font property

[dpdiliberto]

mapbox-gl-js version: v1.11.1

Question

The text-font property seems to look for an array of 2 values, where the second is a fallback that is used when the primary font is missing characters needed for multilingual text. If the GeoJSON for a newly added layer contains a data property that looks like the following:

"labelFont": [
"Open Sans Regular",
"Arial Unicode MS Regular"
],

what would be the corresponding expression that would grab this and set it to the text-font property? The expression ["array", ["get", "labelFont"]] results in the error message Expected array<string> but found array instead.

Links to related documentation

Examples in this page https://docs.mapbox.com/mapbox-gl-js/style-spec/expressions/#lookup may help to clarify how this would work.

[mourner]

There's a limitation on text-font that disallows using expressions for it that don't have a defined constant set of possible output values (see background here mapbox/mapbox-gl-native#9939 (comment)). That means you can't do "text-font": ["get", "labelFont"] (since you can't derive from the style alone which fonts will be used by it), but you could e.g. do ["case", ["get", "isOpenSans"], "Open Sans Regular", "Arial Unicode MS Regular"] (use one or the other depending on the property).

[ykessler]

This worked for me:

["case", ["get", "major"],
 ["literal", [
  "Open Sans Bold",
  "Arial Unicode MS Regular"
]],
  ["literal", [
  "Open Sans Regular",
  "Arial Unicode MS Regular"
]]]