Add `vertical-align` in format expression

[stanislawpuda-tomtom]

Related issue #832.

This PR introduces vertical align property to format expression. It enables to specify how each section should be positioned in relation to biggest element in line. There are three possible options:

• "baseline" default: text baseline or image bottom are in line - this is current behaviour.
• "center": image center or text center are in line.
• "top": image top and text top are in line

Launch Checklist

• [x] Confirm your changes do not include backports from Mapbox projects (unless with compliant license) - if you are not sure about this, please ask!
• [x] Briefly describe the changes in this PR.
• [x] Link to related issues.
• [ ] Include before/after visuals or gifs if this PR includes visual changes.
• [x] Write tests for all new functionality.
• [x] Document any changes to public APIs.
• [ ] Post benchmark scores.
• [x] Add an entry to CHANGELOG.md under the ## main section.

[codecov-commenter]

Codecov Report

All modified and coverable lines are covered by tests :white_check_mark:

Project coverage is 92.80%. Comparing base (f5afe41) to head (4460a7e). Report is 11 commits behind head on main.

Additional details and impacted files

```diff @@ Coverage Diff @@ ## main #900 +/- ## ========================================== + Coverage 92.78% 92.80% +0.01% ========================================== Files 107 107 Lines 4739 4752 +13 Branches 1346 1352 +6 ========================================== + Hits 4397 4410 +13 Misses 342 342 ```

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

[stanislawpuda-tomtom]

I would like to cover questions from the meeting on Nov 13th:

Using HTML

I did check, and it is possible to use HTML to display vertically aligned labels. This approach works for MapLibre GL JS, however it does not cover multiple platforms. There are more advantages of using format expression over custom HTML layer:

• much easier to use
• HTML markers don't support collision detection, as far as I know, which makes the implementation even more difficult
• better performance
• defined once in the style spec for multiple platforms

Format expression already gives possibility to create rich labels on the map, easily, without having to implement own custom solution. Having the possibility to align elements vertically in my opinion is good supplement to format expression. In some cases necessary to make full benefit from it.

Sample use case

Our team created a sample mock how the labels look like with and without vertical alignment.

Before:

After:

[lseelenbinder]

Thanks for taking the time to work through these pieces @stanislawpuda-tomtom!

In my opinion, those advantages are sufficient to merit including in the spec—especially for collision detection and performance reasons.