即使聚合功能不是汇总功能,也会创建堆积的条形图

时间:2020-08-11 10:15:22

标签: vega-lite vega

我有一个串联图,该图具有一个主线图,该图具有一个画笔选择工具,允许用户平移线和点并更改其他4个图上的数据。对于其他图形之一,我尝试获取折线图数据的平均值,但是它不起作用。我没有给我单数的条,而是获得了堆叠的条和错误:“即使聚合函数是非求和的(“均值”),也应用了堆叠”。

这是我的代码:

{
  "$schema": "https://vega.github.io/schema/vega-lite/v4.json",
  "title": "This is kinda sick yo",
  "data": {
    "url": "data/test3.csv"
  },
  "hconcat": [
    {
      "encoding": {
        "color": {
          "condition": {
            "selection": "brush",
            "title": "Species",
            "field": "Species",
            "type": "nominal",
            "scale": {"range": ["green", "#FFFF00", "red"]}
          },
          "value": "lightgray"
        },
        "x": {
          "field": "Variable",
          "type": "nominal",
          "axis": {"labelAngle": -45, "title": "Element",
        "grid": false}
        },
        "y": {
          "title": "Total",
          "field": "Total",
          "type": "quantitative"
        },
          "tooltip": [
      {"field": "Variable", "type": "nominal"},
      {"field": "Total", "type": "quantitative"},
    ]
      },
      "width": 550,
      "height": 300,
      "mark": {"type": "line", "point": "true"},
      "selection": {"brush": {"encodings": ["x"], "type": "interval"}},
      "transform": [{"filter": {"selection": "click"}}]
    },
      {
      "encoding": {
        "color": {
          "condition": {
            "selection": "click",
            "field": "Total",
            "type": "quantitative",
            "scale": {"range": ["green", "#FFFF00", "red"]}
          },
          "value": "lightgray"
        },
        "y": {"field": "Total", "aggregate": "average"},
        "x": {"title": "Species", "field": "Species", "type": "nominal"},
          "tooltip": [
      {"field": "Species", "type": "nominal"},
      {"field": "Total", "type": "quantitative", "aggregate": "average"},
      {"field": "Variable", "type": "nominal"}
    ]
      },
      "height": 300,
      "width": 80,
      "mark": "bar",
      "selection": {"click": {"encodings": ["color"], "type": "multi"}},
      "transform": [{"filter": {"selection": "brush"}}, ]
    },
    {
      "encoding": {
        "color": {
          "condition": {
            "selection": "click",
            "field": "Sex",
            "type": "nominal",
            "scale": {"range": ["#993162", "#75b0a2", "grey"]},
            "legend": null
          },
          "value": "lightgray"
        },
        "y": {"field": "Fisher Sex Value", "type": "quantitative", "aggregate": "mean"},
        "x": {"title": "Sex", "field": "Sex", "type": "nominal"},
          "tooltip": [
      {"field": "Sex", "type": "nominal"},
      {"field": "Fisher Sex Value", "type": "quantitative", "aggregate": "mean"},
    ]
      },
      "height": 300,
      "width": 75,
      "mark": "bar",
      "selection": {"click": {"encodings": ["color"], "type": "multi"}},
      "transform": [{"filter": {"selection": "brush"}}]
    },
      {
      "encoding": {
        "color": {
          "condition": {
            "selection": "click",
            "field": "Sex",
            "type": "nominal",
            "scale": {"range": ["#993162", "#75b0a2", "grey"]},
            "legend": null
          },
          "value": "lightgray"
        },
        "y": {"field": "Mink Sex Value", "type": "quantitative", "aggregate": "mean"},
        "x": {"title": "Sex", "field": "Sex", "type": "nominal"},
          "tooltip": [
      {"field": "Sex", "type": "nominal"},
      {"field": "Mink Sex Value", "type": "quantitative", "aggregate": "mean"},
    ]
      },
      "height": 300,
      "width": 75,
      "mark": "bar",
      "selection": {"click": {"encodings": ["color"], "type": "multi"}},
      "transform": [{"filter": {"selection": "brush"}}]
    },
      {
      "encoding": {
        "color": {
          "condition": {
            "selection": "click",
            "field": "Sex",
            "type": "nominal",
            "scale": {"range": ["#993162", "#75b0a2", "grey"]}
          },
          "value": "lightgray"
        },
        "y": {"field": "Otter Sex Value", "type": "quantitative", "aggregate": "mean"},
        "x": {"title": "Sex", "field": "Sex", "type": "nominal"},
          "tooltip": [
      {"field": "Sex", "type": "nominal"},
      {"field": "Otter Sex Value", "type": "quantitative", "aggregate": "mean"},
    ]
      },
      "height": 300,
      "width": 75,
      "mark": "bar",
      "selection": {"click": {"encodings": ["color"], "type": "multi"}},
      "transform": [{"filter": {"selection": "brush"}}]
    }
  ]
}

第一个图是折线图,第二个图是聚合失败且出现堆栈的图。Here is an image of what the graph looks like currently。任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:0)

Vega-Lite的编码聚合将隐式地按您在一组编码中指定的未聚合字段分组。第二个图表的编码的简化版本如下所示:

arr1 = [1,3,5,7];
arr2 = [4,2,1,6];

let res = arr2.map(a2 => arr1.map(a1 => a1*a2))
console.log(res);

未聚合的编码为{ "encoding": { "color": {"field": "Total"}, "y": {"field": "Total", "aggregate": "average"}, "x": {"field": "Species"}, "tooltip": [ {"field": "Species"}, {"field": "Total", "aggregate": "average"}, {"field": "Variable"} ] ,因此该操作将在计算每个组中["Total", "Species", "Variable"]的{​​{1}}之前对它们进行分组。在每个组中取average的平均值之前,按Total的唯一值进行分组可能不是您想要的。

也许从该图表中删除颜色编码将为您带来更有意义的结果。