如何向此 Vega 可视化添加图例

【问题标题】：How can I add a legend to this Vega visualization如何向此 Vega 可视化添加图例
【发布时间】：2019-04-18 00:52:13
【问题描述】：

我正在尝试弄清楚如何将图例添加到示例 vega 可视化 here。任何如何做到这一点的例子都将不胜感激。最好是交互式的，并在可视化上突出显示或显示数据，但即使只是一个简单的图例也会是一个很大的改进。

谢谢

【问题讨论】：

标签： visualization vega

【解决方案1】：

对于在此Vega Donut Chart Demo 中使用legends 的简单起点：

Here's the same example Vega sandbox 和我的`legends` 代码在`marks` 部分之后添加。

这是我使用的图例代码：

  "legends": [
    {
      "fill": "color",
      "title": "This is the Title",
      "orient": "top-left",
      "encode": {
        "symbols": {"enter": {"fillOpacity": {"value": 0.5}}},
        "labels": {"update": {"text": {"field": "value"}}}
      }
    }
  ]

这应该作为一个有用的示例起点。 legends的其他属性可以是found here.

【讨论】：

你知道在 js 版本的规范中把它放在哪里了吗？即 vl.encode、vl.data 等

Here's the same example Vega sandbox 和我的legends 代码在marks 部分之后添加。

Here's the same example Vega sandbox 和我的`legends` 代码在`marks` 部分之后添加。