求助：解决Vega条形图过滤数据后图例颜色不匹配问题

你遇到的问题核心是动态生成的比例尺domain导致颜色映射随过滤结果变化——当前代码里的domain直接从过滤后的数据集colour字段取值，过滤后剩余数据的colour值顺序改变，就会打乱range里颜色的对应关系。

要让颜色和数据值固定绑定，只需要把比例尺的domain设置为固定的、包含所有可能颜色值的数组，同时让range里的颜色按顺序一一对应这些值即可。

修改后的比例尺代码如下：

{
  "name": "legend",
  "type": "ordinal",
  "domain": ["yellow", "red", "white"], // 固定所有可能的颜色值，和range一一对应
  "range": ["#FACC00", "#D92121", "#FFFFFF"]
}

如果你的数据里是直接用国家名称关联颜色（比如USA对应red、France对应yellow），也可以直接把domain设为国家名称，让映射更直观：

{
  "name": "legend",
  "type": "ordinal",
  "domain": ["France", "USA", "Germany", "China"],
  "range": ["#FACC00", "#D92121", "#D92121", "#FFFFFF"]
}

这样不管怎么过滤数据集，每个颜色值（或国家）都会始终映射到固定的十六进制色码，不会出现匹配错位的情况。

内容的提问来源于stack exchange，提问作者T.Richter