CODEWITHSUNDEEP
mapboxmapbox-gl-jsmapbox-glmapbox-expressions
SERG
SERG

Reputation: 3971

How to set "text-font" with mapbox expressioins

I am trying to set the font with the help of Mapbox expressions from font_size field. This doesn't work for me (Invalid data expression for "text-font". Output values must be contained as literals within the expression)

 "text-font":  [
      "case",
      ['!=', ["get", "text_font"], ""],
      ["get", "text_font"],
      ['literal',['DIN Offc Pro Italic', 'Arial Unicode MS Regular']]
  ],

So I want to get a text-font from text_font: ["Open Sans Semibold Italic"] and if it is empty like text_font: "" use ['DIN Offc Pro Italic', 'Arial Unicode MS Regular'] Thanks

Upvotes: 2

Views: 2599

Answers (2)

Oliver N
Oliver N

Reputation: 11

this is an old post but I've just come across a better solution while having the same problem.

You can use the format expression as described here. You'll want to use the text-field property rather than the text-font field.

Example:

"text-field": [
      "format",
      "Hello ",
      {
        "text-font": ["get", "text_font"],
        "text-color": "#f7f7f7",
      },
    ]

You can also use an expression for the color and content too, see below.

"text-field": [
      "format",
      ["get", "text_content"],
      {
        "text-font": ["get", "text_font"],
        "text-color": ["get", "text_color"],
      },
    ]

Upvotes: 1

Steve Bennett
Steve Bennett

Reputation: 126385

I think the error message is telling you what you need to know, but don't want to hear:

Invalid data expression for "text-font". Output values must be contained as literals within the expression.

The output values (that is, the font that is going to be set) must be specified as a literal - not derived from a feature property.

So you could do something like this as a workaround:

"text-font":  [
  "match", ["get", "text_font"],
    "Open Sans Semibold Italic", ["literal", ["Open Sans Semibold Italic"]],
    "Arial", ["literal", ["Arial"]],
    // ... all possible values ...
    ['literal',['DIN Offc Pro Italic', 'Arial Unicode MS Regular']]
  ]
],

Upvotes: 3

Related Questions