更改折线图中线条的颜色 vegalite

Question

我想更改折线图中线条的颜色。它们目前设置为自动。两条线代表两个不同的数据点。我的代码：

vegalite({
  width: 600,
  heigth: 800,
  data: { values: MeanAp },
  mark: {
    type: "line",
    interpolate: "natural"
  },
  encoding: {
    x: {
      timeUnit: "month",
      field: "month_mean",
      type: "temporal",
      title: "Month"
    },
    y: {
      aggregate: "sum",
      type: "quantitative",
      field: "amount"
    },
    color: {
      type: "nominal",
      field: "status_mean"
    }
  }
})

下图：

Answer 1

您可以通过定义自定义比例范围或设置配色方案来更改线条的颜色。

例如，您可以像这样手动设置颜色范围，使用任何有效的 HTML 颜色名称或十六进制代码：

color: {
  type: "nominal",
  field: "status_mean"
  scale: {
    range: ["green", "blue"]
  }
}

或者，您可以使用 pre-defined Vega color schemes:

之一

color: {
  type: "nominal",
  field: "status_mean"
  scale: {
    scheme: "accent"
  }
}

可以在 Vega-Lite 的 Scale Range 文档中找到可用颜色选项的完整描述。

更改折线图中线条的颜色 vegalite

change the color of the lines in the line chart vegalite

d3.js

line

linechart

vega-lite

vega