我可以使其看起来更像是箱形图吗?

时间:2020-10-16 00:37:55

标签: vega-lite vega

我正在与提供最小,最大,Q1,Q2和Q3数据的Elasticsearch合作。我要做的就是以箱形图的形式绘制它。截至目前,Kibana仅支持vega-lite 2.6.0版和vega 4.3.0版。

这是我制作的完整样本。

{
  "$schema": "https://vega.github.io/schema/vega-lite/v2.json",
  "width": 100,
  "height": 200,
  "padding": 10,
 

  "data": {
    "name": "sample",
    "values": [
      {
      "task": "A", 
      "min" : 72.66500091552734,
      "max" : 139.54299926757812,
      "q1" : 98.68599700927734,
      "q2" : 120.12850189208984,
      "q3" : 121.82099914550781
      },
      {
      "task": "B", 
      "min" : 71.66500091552734,
      "max" : 159.54299926757812,
      "q1" : 88.68599700927734,
      "q2" : 110.12850189208984,
      "q3" : 141.82099914550781
      },
      {
      "task": "c", 
      "min" : 45.66500091552734,
      "max" : 169.54299926757812,
      "q1" : 88.68599700927734,
      "q2" : 110.12850189208984,
      "q3" : 141.82099914550781
      }
    ]
  },
  
  "layer": [
    {
      "width": 5,
      "encoding": {
        "x": {"type": "ordinal","field": "task"},
        "y": {"type": "quantitative","field": "min"},
        "y2": {"type": "quantitative","field": "max"},
        "color": {"value": "#2CB5E8"}
      },
      "mark": {
        "type": "bar"
      }
    },
    {
      "width": 20,
      "encoding": {
        "x": {"type": "ordinal","field": "task"},
        "y": {"type": "quantitative","field": "q1"},
        "y2": {"type": "quantitative","field": "q3"},
        "color": {"value": "#EB985E"}
      },
      "mark": "bar"
    },
    {
      "encoding": {
        "x": {"type": "ordinal","field": "task"},
        "y": {"type": "quantitative","field": "q2"},
        "color": {"value": "#090502"}
      },
      "mark": "point"
    }
  ]
}

这是情节的样子: enter image description here

但是箱形图看起来像这样 enter image description here

当前版本的vega-lite确实支持boxplot。但是我坚持使用旧版本。 enter image description here

我正在尝试减小最小和最大条形图的宽度。并保持Q1和Q3的厚度。不知何故它不起作用。

还可以将Q2绘制为一条平线而不是点吗?

1 个答案:

答案 0 :(得分:1)

您可以使用带有条形,刻度和规则标记的层图手动构造箱线图。例如(view in editor):

{
  "$schema": "https://vega.github.io/schema/vega-lite/v2.json",
  "width": 100,
  "height": 200,
  "data": {
    "name": "sample",
    "values": [
      {
        "task": "A",
        "min": 72.66500091552734,
        "max": 139.54299926757812,
        "q1": 98.68599700927734,
        "q2": 120.12850189208984,
        "q3": 121.82099914550781
      },
      {
        "task": "B",
        "min": 71.66500091552734,
        "max": 159.54299926757812,
        "q1": 88.68599700927734,
        "q2": 110.12850189208984,
        "q3": 141.8209991455078
      },
      {
        "task": "c",
        "min": 45.66500091552734,
        "max": 169.54299926757812,
        "q1": 88.68599700927734,
        "q2": 110.12850189208984,
        "q3": 141.8209991455078
      }
    ]
  },
  "layer": [
    {
      "encoding": {
        "x": {"type": "ordinal", "field": "task"},
        "y": {"type": "quantitative", "field": "min"},
        "y2": {"type": "quantitative", "field": "max"}
      },
      "mark": {"type": "rule", "color": "black"}
    },
    {
      "encoding": {
        "x": {"type": "ordinal", "field": "task"},
        "y": {"type": "quantitative", "field": "q1"},
        "y2": {"type": "quantitative", "field": "q3"}
      },
      "mark": {"type": "bar", "color": "#EB985E", "size": 20}
    },
    {
      "encoding": {
        "x": {"type": "ordinal", "field": "task"},
        "y": {"type": "quantitative", "field": "q2"}
      },
      "mark": {"type": "tick", "color": "gray", "size": 20}
    }
  ]
}

enter image description here