如何在滑块滑动到指定年份时禁用配色方案并启用配色方案？

Question

我是 vegalite 的新手，我使用 facet 创建了这个图表。问题是我想让我的图表变灰，只在滑块中的指定年份应用颜色范围？但这是以相反的方式工作的，即指定年份为黑色，其余年份有正确的配色方案？任何帮助是 appreciated.Thanks.Viz here

{
  "$schema": "https://vega.github.io/schema/vega-lite/v4.json",
  "description": "A simple grid of bar charts to compare performance data.",
  "background": "#e6f4fd",
  "data": {
   "url": "https://raw.githubusercontent.com/sookyee/FIT3179/main/TheTimesRanking.json"
  },
   "transform": [
    {

      "filter": "(datum.university_name === 'Harvard University' || datum.university_name ==='Massachusetts Institute of Technology' || datum.university_name ==='Stanford University' || datum.university_name ==='California Institute of Technology' || datum.university_name ==='University of Cambridge' || datum.university_name ==='Princeton University') "

    }
  ],
   "selection": {
    "Yr": {
      "type": "single",
      "fields": ["year"],
      "bind": {
        "year": {"input": "range", "min": 2011, "max": 2015, "step": 1}
      }
    }
   },
  "width": 200,
  "height": {"step": 8},
  "spacing": 60,
  "mark": "bar",
  "encoding": {
    "y": {"field": "research", "type": "quantitative", "title": "Research"},
    "x": {
      "field": "university_name",
      "type": "ordinal",
      "title": null
    },
    "color": {
      "field": "teaching",
      "type": "quantitative",
      "legend": {"orient": "bottom", "titleOrient": "left"},
      "title": "Teaching quality (%)",
      "scale": { "scheme": "lighttealblue"},
      "condition": {"selection": "Yr", "field": "year", "type": "ordinal"} 
    },
    "column": {"field": "year", "title": "Year", "header": {"labelAngle": 0}}
  }

}

Answer 1

您的颜色条件当前显示“按 teaching 上色，除非选择该值，然后按 year 上色”。你想说的是“颜色浅灰色，除非选择该值，然后按 teaching 着色”。就图表规范而言，它看起来像这样：

    "color": {
      "value": "lightgray",
      "condition": {
        "selection": "Yr",
        "field": "teaching",
        "legend": {"orient": "bottom", "titleOrient": "left"},
        "scale": {"scheme": "lighttealblue"},
        "title": "Teaching quality (%)",
        "type": "ordinal"
      }
    },

在编辑器中查看完整图表here。

如何在滑块滑动到指定年份时禁用配色方案并启用配色方案？

How to disable colour scheme and enable colour scheme when slider slides to specified year?

vega-lite