Search code examples
mapboxmapbox-gl-jsmapbox-expressions

Convert icon-translate property function, stops, to mapbox expression

In mapbox how can I convert this icon-translate stops to an Expression with interpolate. I can't figure it out from the mapbox docs.

The stops works correctly and changes the offset of the icon based on the zoom level, between the two zoom levels 12 and 15. Typescript errors because stops isn't an expression.

        'icon-translate': {
          // @ts-ignore
          stops: [
            [12, [0, 0]],
            [15, [0, -55]]
          ]
        },

Thanks for the help.

Edit: This worked with no more js errors and typescript

        'icon-translate': ['interpolate',['linear'],['zoom'],
          12, ["literal",[0, 0]],
          15, ["literal",[0, -55]]
        ],
Solution

  • Like this:

    {
'icon-translate': ['interpolate',['linear'],['zoom'], 
    12, ['literal', [0, 0]],
    15, ['literal', [0, -55]]
]
}