Question

我在datasets中有一个数据源，可在两个串联的图表中使用。现在，当我单击左侧图表中的条形图时，我想过滤右侧图表。查看动画gif：

但是不是。单击here以在vega编辑器中打开。或在此处查看规格：

{
  "config": {"view": {"width": 400, "height": 300}},
  "hconcat": [
    {
      "width": 100,
      "selection": {"SELECT": {"type": "single", "resolve": "global"}},
      "data": {"name": "table_data"},
      "mark": "bar",
      "encoding": {
        "x": {"type": "nominal", "field": "Major_Genre"},
        "y": {"aggregate": "count", "type": "quantitative"},
        "color": {"type": "nominal", "field": "Major_Genre"},
        "fillOpacity": {
          "condition": {"selection": "SELECT", "value": 1},
          "value": 0.3
        }
      }
    },
    {
      "width": 100,
      "data": {"name": "table_data"},
      "transform": [{"filter": {"selection": "SELECT"}}],
      "mark": "bar",
      "encoding": {
        "x": {"type": "nominal", "field": "Major_Genre"},
        "y": {"aggregate": "count", "type": "quantitative"},
        "color": {"type": "nominal", "field": "Major_Genre"}
      }
    }
  ],
  "datasets": {
    "table_data": [
      {
        "Title": "Cidade de Deus",
        "Major_Genre": "Drama",
        "Country_Origin": "Brazil"
      },
      {
        "Title": "Chocolate: Deep Dark Secrets",
        "Major_Genre": "Thriller/Suspense",
        "Country_Origin": "India"
      },
      {"Title": "Fiza", "Major_Genre": "Drama", "Country_Origin": "India"},
      {
        "Title": "First Love, Last Rites",
        "Major_Genre": "Drama",
        "Country_Origin": "United States"
      },
      {
        "Title": "Foolish",
        "Major_Genre": "Comedy",
        "Country_Origin": "United States"
      },
      {
        "Title": "I Married a Strange Person",
        "Major_Genre": "Comedy",
        "Country_Origin": "United States"
      }
    ]
  }
}

Answer 1

当选择引用点组而不是单个点时，您需要提供一个明确的fields或encodings参数来指定选择中包括哪些点。

在这种情况下，如果您通过以下方式之一指定选择，则图表将按预期运行：

"selection": {"SELECT": {"type": "single", "fields": ["Major_Genre"], "resolve": "global"}}

"selection": {"SELECT": {"type": "single", "encodings": ["color"], "resolve": "global"}}

"selection": {"SELECT": {"type": "single", "encodings": ["x"], "resolve": "global"}}

以下是工作图表：(vega editor link)。

根据参考表中的选择进行过滤

1 个答案: