如何在 vega-lite 中管理层和列

Question

我从 this trellis chart 开始，其中有 3 列。

我必须添加一个规则，而不是我需要使用一个图层。我已经编辑了我的配置，现在我 have this one：我丢失了列，所有内容都在一行中。

如何不丢失列中的排列？

Answer 1

将整个 facet 和 layer 包裹在 vconcat 内，并提供 columns: 3 外侧面。参考下面的代码或editor

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "name": "trellis_barley",
  "description": "Trellis",
  "title": {
    "text": "Ingressi giornalieri in Terapia Intensiva (TI) a confronto con ricoveri totali in TI",
    "color": "#168CC7",
    "fontSize": 18,
    "anchor": "start",
    "font": "Montserrat",
    "subtitle": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam convallis enim ac fringilla feugiat",
    "subtitleFont": "Montserrat"
  },
  "data": {
    "url": "https://raw.githubusercontent.com/ondata/covid19italia/master/elaborazioni/dpc_covid19/terapiaIntensiva/processing/terapiaIntensivaRegSoglia.csv"
  },
  "vconcat": [
    {
      "columns": 3,
      "facet": {
        "field": "denominazione_regione",
        "type": "ordinal",
        "title": ""
      },
      "spec": {
        "layer": [
          {
            "mark": "point",
            "encoding": {
              "x": {
                "field": "ingressi_terapia_intensiva_mm",
                "type": "quantitative",
                "title": "Ingressi giornalieri in TI",
                "scale": {"zero": false, "padding": 10}
              },
              "y": {
                "field": "terapia_intensiva_mm",
                "type": "quantitative",
                "title": "Totale ricoveri in TI",
                "scale": {"zero": false, "padding": 10}
              },
              "tooltip": [
                {"field": "mese", "type": "nominal", "title": "mese"}
              ],
              "color": {
                "field": "mese",
                "type": "nominal",
                "legend": {"title": "Mesi"},
                "scale": {"scheme": "tableau10"}
              }
            }
          },
          {
            "mark": {"type": "rule", "color": "red"},
            "encoding": {
              "y": {"field": "soglia30", "type": "quantitative", "title": null},
              "size": {"value": 1}
            }
          }
        ]
      },
      "resolve": {"scale": {"x": "independent", "y": "independent"}}
    }
  ]
}

如何在 vega-lite 中管理层和列

How to manage layers and colums in vega-lite

vega-lite