Vega lite 高亮数据

Question

我在 Vega lite 中有一个显示国家和分数的 hconcat 函数。我想突出显示一些国家（改变一些国家的颜色并保持原样）但是当我使用颜色功能时，如果它在 outsite go hconcad 中，它会给我一个错误，或者只是在一张图中突出显示我想要的国家但不显示其余部分：

一无所有：

hconcat 中的颜色：

我如何在 hconcat 外部（或在内部我可以在所有图表中重复）进行突出显示，同时将所有其他数据保留为相同颜色。

我的代码：

        {
  "$schema": "https://vega.github.io/schema/vega-lite/v4.json",
  "data": {
    "url": "https://raw.githubusercontent.com/DanStein91/Info-vis/master/coffee.csv",
    "format": {
      "type": "csv",
      "parse": {
        "Aroma": "number",
        "Flavor": "number",
        "Aftertaste": "number",
        "Acidity": "number",
        "Clean_Cup": "number",
        "Body": "number",
        "Balance": "number",
        "Uniformity": "number",
        "Cupper_Points": "number",
        "Sweetness": "number"
      }
    }
  },
"transform": [
        {
          "filter": "datum.Country_of_Origin"
        },
        {
          "calculate": "datum.Aroma + datum.Flavor + datum.Aftertaste + datum.Acidity + datum.Sweetness + datum.Balance ",
          "as": "Taste_Points"
        },
        {
          "calculate": "datum.Cupper_Points + datum.Clean_Cup + datum.Uniformity",
          "as": "Cup_Points"
        }
      ],
      "hconcat": [
        {
          "mark": "bar",
          "encoding": {
            "y": {
              "field": "Country_of_Origin",
              "type": "nominal",
              "sort": "-x"
            },
            "x": {
              "field": "Taste_Points",
              "type": "quantitative",
              "aggregate": "mean"
            }
          }
        },
        {
          "mark": "bar",
          "encoding": {
            "y": {
              "field": "Country_of_Origin",
              "type": "nominal",
              "sort": "-x"
            },
            "x": {
              "field": "Cup_Points",
              "type": "quantitative",
              "aggregate": "mean"
            }
          }
        },
        {
          "mark": "bar",
          "encoding": {
            "y": {
              "field": "Country_of_Origin",
              "type": "nominal",
              "sort": "-x"
            },
            "x": {
              "field": "Total_Cup_Points",
              "type": "quantitative",
              "aggregate": "mean"
            },
      "color": {
        "field": "Country_of_Origin",
        "type": "nominal",
        "scale": {
          "domain": [
            "Papua New Guinea",
            "Mauritius"
          ],
          "range": [
            "#8101FA",
            "#00C7A9"
          ]
        }
      }
          }
        }
      ],
      "config": {}
    }

谢谢。

Answer 1

您可以使用 Repeat Chart along with a Condition in the color encoding. The result might look something like this (view in editor):

{
  "$schema": "https://vega.github.io/schema/vega-lite/v4.json",
  "data": {
    "url": "https://raw.githubusercontent.com/DanStein91/Info-vis/master/coffee.csv",
    "format": {
      "type": "csv",
      "parse": {
        "Aroma": "number",
        "Flavor": "number",
        "Aftertaste": "number",
        "Acidity": "number",
        "Clean_Cup": "number",
        "Body": "number",
        "Balance": "number",
        "Uniformity": "number",
        "Cupper_Points": "number",
        "Sweetness": "number"
      }
    }
  },
  "transform": [
    {"filter": "datum.Country_of_Origin"},
    {
      "calculate": "datum.Aroma + datum.Flavor + datum.Aftertaste + datum.Acidity + datum.Sweetness + datum.Balance ",
      "as": "Taste_Points"
    },
    {
      "calculate": "datum.Cupper_Points + datum.Clean_Cup + datum.Uniformity",
      "as": "Cup_Points"
    }
  ],
  "repeat": ["Taste_Points", "Cup_Points", "Total_Cup_Points"],
  "spec": {
    "mark": "bar",
    "encoding": {
      "y": {"field": "Country_of_Origin", "type": "nominal", "sort": "-x"},
      "x": {
        "field": {"repeat": "repeat"},
        "type": "quantitative",
        "aggregate": "mean"
      },
      "color": {
        "value": "steelblue",
        "condition": {
          "test": {
            "field": "Country_of_Origin",
            "oneOf": ["Papua New Guinea", "Mauritius"]
          },
          "field": "Country_of_Origin",
          "type": "nominal",
          "scale": {
            "domain": ["Papua New Guinea", "Mauritius"],
            "range": ["#8101FA", "#00C7A9"]
          }
        }
      }
    }
  }
}

Vega lite 高亮数据

Vega lite highlighting data

vega-lite