如何對齊分層堆疊條形圖中的每個文本標記？

Question

我嘗試使用顏色編碼或 x 編碼調整每個文本標記的編碼，但始終無法讓 label 位於正確的段中。 由於我試圖實現的非常規層，我一定誤解了一些編碼。

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "hconcat": [
    {
      "transform": [{"filter": {"field": "sentiment", "equal": "negative"}}],
      "encoding": {
        "y": {"field": "type", "title": null, "axis": null},
        "x": {
          "field": "sentiment",
          "aggregate": "count",
          "axis": null,
          "sort": "descending"
        },
        "color": {"field": "channel"}
      },
      "layer": [
        {"mark": "bar"},
        {
          "mark": {"type": "text", "fill": "white"},
          "encoding": {"text": {"field": "sentiment", "aggregate": "count"}}
        }
      ]
    },
    {
      "width": 20,
      "mark": {"type": "text", "align": "center", "fontWeight": 400},
      "encoding": {
        "y": {"field": "type", "axis": null},
        "text": {"field": "type"}
      }
    },
    {
      "transform": [{"filter": {"field": "sentiment", "equal": "positive"}}],
      "encoding": {
        "color": {"field": "channel"},
        "y": {"field": "type", "axis": null},
        "x": {"field": "sentiment", "aggregate": "count", "axis": null}
      },
      "layer": [
        {"mark": "bar"},
        {
          "mark": {"type": "text", "fill": "white"},
          "encoding": {"text": {"field": "sentiment", "aggregate": "count"}}
        }
      ]
    }
  ],
  "config": {"view": {"stroke": null}, "axis": {"grid": false}},
  "data": {
    "values": [
      {"id": 1, "type": "shops", "channel": "line man", "sentiment": "negative"}
    ]
  }
}

Answer 1

我現在開始工作了。 我所要做的就是在兩個條形圖的 x 編碼中添加一個值為 0 的堆棧屬性。