如何为分层线图创建图例

Question

基本上，我拥有的是一个折线图，该折线图是从多个折线图分层而成的。由于每个图形只有一条线，因此不会自动生成图例，那么获取图表图例的最佳方法是什么？我一直在考虑尝试转换我的数据集。这是从2019年到2020年6月，疾病控制中心每周的死亡总数。csv的排列方式是每个州的每个日期都有一条记录，每种疾病类型是其自己的列，而整数是列值。因此，没有一个要绘制的字段，有很多，因此是分层。对于如何解决此问题的任何见解将不胜感激！到目前为止，这是我的工作：

https://observablehq.com/@justin-krohn/covid-excess-deaths

Answer 1

您可以通过将每个图层的颜色编码设置为datum来指定要具有的标签，从而为分层图表创建图例。例如（vega editor）：

{
  "data": {
    "values": [
      {"x": 1, "y1": 1, "y2": 2},
      {"x": 2, "y1": 3, "y2": 1},
      {"x": 3, "y1": 2, "y2": 4},
      {"x": 4, "y1": 4, "y2": 3},
      {"x": 5, "y1": 3, "y2": 5}
    ]
  },
  "encoding": {"x": {"field": "x", "type": "quantitative"}},
  "layer": [
    {
      "mark": "line",
      "encoding": {
        "y": {"field": "y1", "type": "quantitative"},
        "color": {"datum": "y1"}
      }
    },
    {
      "mark": "line",
      "encoding": {
        "y": {"field": "y2", "type": "quantitative"},
        "color": {"datum": "y2"}
      }
    }
  ]
}

或者，您可以使用Fold Transform来旋转数据，以便您可以使用简单的颜色编码来绘制多条线，而不是手工图层。例如（vega editor）：

{
  "data": {
    "values": [
      {"x": 1, "y1": 1, "y2": 2},
      {"x": 2, "y1": 3, "y2": 1},
      {"x": 3, "y1": 2, "y2": 4},
      {"x": 4, "y1": 4, "y2": 3},
      {"x": 5, "y1": 3, "y2": 5}
    ]
  },
  "transform": [{"fold": ["y1", "y2"], "as": ["name", "y"]}],
  "mark": "line",
  "encoding": {
    "x": {"field": "x", "type": "quantitative"},
    "y": {"field": "y", "type": "quantitative"},
    "color": {"field": "name", "type": "nominal"}
  }
}