时间戳

首页 > 解决方案 > 如何在 Vega-lite 变换中使用条件语句

vega-lite - 如何在 Vega-lite 变换中使用条件语句

问题描述

我的示例源代码如下

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "description": "A simple bar chart with embedded data.",
  "data": {
    "values": [
      {"a": "A", "b": 302},
      {"a": "B", "b": 2794},
      {"a": "C", "b": 96237},
      {"a": "D", "b": 766995},
      {"a": "E", "b": 7691230},
      {"a": "F", "b": 59755899},
      {"a": "G", "b": 229910863},
      {"a": "H", "b": 9342989068},
      {"a": "I", "b": 19617657788},
      {"a": "J", "b": 140800000001}
    ]
  },
    "encoding": {
    "x": {"field": "a", "type": "nominal", "axis": {"labelAngle": 0}},
    "y": {"field": "b", "type": "quantitative"}
  },
  "layer": [{
    "mark": "bar"
  },
  {
    "mark":{
       "type":"text",
       "align":"center",
       "baseline":"middle",
       "dx":0,
       "dy":-5
    } ,
    "encoding":{
       "text":{"field":"b","type":"quantitative"}
    }
  }
  ]
}

我希望 Vega-lite 通过以下逻辑为文本标记生成标签

if absoluteValue(b)>1 and if absoluteValue(b)<999 then format""
else
if absoluteValue(b)>1000 and if absoluteValue(b)<9999 then format.2s
else
if absoluteValue(b)>10000 and if absoluteValue(b)<99999 then format.3s
else
if absoluteValue(b)>100000 and if absoluteValue(b)<999999 then format.4s
else
if absoluteValue(b)>1000000 and if absoluteValue(b)<9999999 then format.2s
else
if absoluteValue(b)>10000000 and if absoluteValue(b)<99999999 then format.3s
else
if absoluteValue(b)>100000000 and if absoluteValue(b)<999999999 then format.4s
else
if absoluteValue(b)>1000000000 and if absoluteValue(b)<9999999999 then format.2s
else
if absoluteValue(b)>10000000000 and if absoluteValue(b)<99999999999 then format.3s
else
format.4s

以下是我想要的结果

| a     | b             | desired format    |
|---    |-------------- |----------------   |
| A     | 302           | 302               |
| B     | 2794          | 2.8k              |
| C     | 96237         | 96.2k             |
| D     | 766995        | 767.0k            |
| E     | 7691230       | 7.7M              |
| F     | 59755899      | 59.8M             |
| G     | 229910863     | 229.9M            |
| H     | 9342989068    | 9.3G              |
| I     | 19617657788   | 19.6G             |
|       | 140800000001  | 140.8G            |

Wahab Memon 在另一个问题Vega-lite 中向我展示了如何以 SI 单位显示文本值如何使用条件语句，但我不知道如何将其扩展到多个语句。我也找不到任何证明它的文档。我想知道我是否可以使用iforswitch语句来实现这一点。

有人可以指出我正确的方向。先感谢您 ！！！

标签： vega-lite

解决方案

以下是在计算中使用三元定义条件的可能方法，其工作方式与 if-else 相同：

"transform": [
    {
      "calculate": " 0 < datum.b && datum.b < 999 ? format(datum.b,'.1s') : 999 < datum.b && datum.b < 9999? format(datum.b,'.2s') : 9999 < datum.b && datum.b < 9999? format(datum.b,'.3s') : format(datum.b,'.4s')",
      "as": "textValue"
    }
  ],

另一个更简洁的选择是使用多重计算：

"transform": [
        {
          "calculate": " 0 < datum.b && datum.b < < 999 ? format(datum.b,'.1s') : datum.textValue",
          "as": "textValue"
        }, {
          "calculate": "999 < datum.b && datum.b < < 9999? format(datum.b,'.2s') : datum.textValue",
          "as": "textValue"
        }, {
          "calculate": "9999 < datum.b && datum.b < < 9999? format(datum.b,'.3s') : datum.textValue",
          "as": "textValue"
        }
      ],

编辑

请参阅以下代码段和编辑器：

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "description": "A simple bar chart with embedded data.",
  "data": {
    "values": [
      {"a": "A", "b": 302},
      {"a": "B", "b": 2794},
      {"a": "C", "b": 96237},
      {"a": "D", "b": 766995},
      {"a": "E", "b": 7691230},
      {"a": "F", "b": 59755899},
      {"a": "G", "b": 229910863},
      {"a": "H", "b": 9342989068},
      {"a": "I", "b": 19617657788},
      {"a": "J", "b": 140800000001}
    ]
  },
  "transform": [
    {
      "calculate": " 0 < datum.b && datum.b <= 999 ? format(datum.b,'') : datum.b",
      "as": "textVal"
    },
    {
      "calculate": "1000 <= datum.b && datum.b <= 9999? format(datum.b,'.2s') : datum.textVal",
      "as": "textVal"
    },
    {
      "calculate": "10000 <= datum.b && datum.b <= 99999? format(datum.b,'.3s') : datum.textVal",
      "as": "textVal"
    },
    {
      "calculate": "100000 <= datum.b && datum.b <= 999999? format(datum.b,'.4s') : datum.textVal",
      "as": "textVal"
    },
    {
      "calculate": "1000000 < datum.b && datum.b <= 9999999? format(datum.b,'.2s') : datum.textVal",
      "as": "textVal"
    },
    {
      "calculate": "10000000 < datum.b && datum.b <= 99999999? format(datum.b,'.3s') : datum.textVal",
      "as": "textVal"
    },
    {
      "calculate": "100000000 < datum.b && datum.b <= 999999999? format(datum.b,'.4s') : datum.textVal",
      "as": "textVal"
    },
    {
      "calculate": "1000000000 < datum.b && datum.b <= 9999999999? format(datum.b,'.2s') : datum.textVal",
      "as": "textVal"
    },
    {
      "calculate": "10000000000 < datum.b && datum.b <= 99999999999? format(datum.b,'.3s') : datum.textVal",
      "as": "textVal"
    },
    {
      "calculate": "100000000000 < datum.b && datum.b <= 999999999999? format(datum.b,'.4s') : datum.textVal",
      "as": "textVal"
    }
  ],
  "encoding": {
    "x": {"field": "a", "type": "nominal", "axis": {"labelAngle": 0}},
    "y": {"field": "b", "type": "quantitative"}
  },
  "layer": [
    {"mark": {"type": "bar", "tooltip": true}},
    {
      "mark": {
        "type": "text",
        "align": "center",
        "baseline": "middle",
        "dx": 0,
        "dy": -5,
        "tooltip": true
      },
      "encoding": {"text": {"field": "textVal"}}
    }
  ]
}

推荐阅读