text-offset property is broken for CJK text in vertical writing mode

[zmiao]

text-offset property is broken for CJK text in vertical writing mode.

mapbox-gl-js version:
main branch
browser:
any

Steps to Trigger Behavior

Test with the following style:

Test style

{
    "version": 8,
    "zoom": 0,
    "center": [-14.41400, 39.09187],
    "sources": {
      "lineGeo": {
        "type": "geojson",
        "data": {
          "type": "FeatureCollection",
          "features": [
      "pointGeo": {
        "type": "geojson",
        "data": {
          "type": "FeatureCollection",
          "features": [
            {
              "type": "Feature",
              "properties": {
                "name": "新华路12号"
              },
              "geometry": {
                "type": "Point",
                "coordinates":
                  [
                    -14.414062499999998,
                    39.091699613104595
                  ]
              }
            }
          ]
        }
      }
    },
    "glyphs": "mapbox://fonts/mapbox/{fontstack}/{range}.pbf",
    "layers": [
        {
            "id": "background",
            "type": "background",
            "layout": {},
            "paint": {"background-color": "hsl(38, 48%, 86%)"}
        },
      {
        "id": "lines-symbol",
        "type": "symbol",
        "source": "pointGeo",
        "layout": {
          "text-field": "天空A",
          "symbol-placement": "point",
          "symbol-spacing": 150,
          "text-font": [
            "Open Sans Semibold",
            "Arial Unicode MS Regular"
          ],
          "text-writing-mode": ["vertical"],
          "text-rotation-alignment" : "auto",
          "text-size": [
            "interpolate",
            ["linear"],
            ["zoom"],
            0,
            30,
            22,
            15
        ],
          "text-padding": 4,
          "text-allow-overlap": true,
          "text-offset": [
            3,
            -3
          ]
        },
        "paint": {
            "text-color": [
                "interpolate",
                ["linear"],
                ["zoom"],
                5,
                "hsl(0, 0%, 33%)",
                6,
                "hsl(0, 0%, 0%)"
            ],
            "text-halo-blur": 0.5,
            "text-halo-color": "hsla(0, 0%, 100%, 0.95)",
            "text-halo-width": 3,
            "text-opacity": 1
        }
      }, {
        "id": "dots",
        "type": "circle",
        "source": "pointGeo",
        "paint": {
            "circle-color": "red"
        }
      }
    ]
  }

Expected Behavior

The red dot is the anchor point

Actual Behavior

[asheemmamoowala]

Fixed in #8781