如何利用Vega内置转换直接处理高效格式数据，无需手动转对象数组？

我正在使用Vega进行数据可视化，Vega要求的数据格式是对象数组：

const accepted = [
    { num: 1, char: 'A' },
    { num: 2, char: 'B' },
    { num: 3, char: 'C' },
]

但传输这类数据（比如通过JSON）时，因为每个对象都重复num、char这些键，传输效率很低。更高效的传输格式是列格式的：

const efficient = {
   num: [1, 2, 3 ],
   char: ['A', 'B','C']
}

目前我都是手动把efficient格式转成accepted格式再传给Vega，想问下能不能用Vega的transform直接处理这种高效格式，不用手动转换？

答案 #

当然可以，Vega的transform模块专门支持这类列格式数据到对象数组的转换，不用手动写转换代码，直接在可视化配置里加transform就行。

具体配置示例 #

你可以通过sequence生成索引序列，再用lookup匹配对应列的数值，最终得到Vega需要的对象数组格式：

{
  "data": [
    {
      "name": "raw-data",
      "values": {
        "num": [1, 2, 3],
        "char": ["A", "B", "C"]
      }
    },
    {
      "name": "formatted-data",
      "source": "raw-data",
      "transform": [
        // 生成和数组长度一致的索引，从0开始
        {
          "type": "sequence",
          "start": 0,
          "stop": {"signal": "length(data('raw-data')[0].num)"},
          "as": "idx"
        },
        // 通过索引匹配每一列对应位置的值
        {
          "type": "lookup",
          "from": "raw-data",
          "key": "idx",
          "fields": ["idx"],
          "values": ["num", "char"],
          "as": ["num", "char"]
        },
        // 可选：删掉临时用的索引字段
        {
          "type": "project",
          "fields": ["num", "char"]
        }
      ]
    }
  ]
}

之后你的可视化组件直接用formatted-data这个数据源就行，完全不用提前转换数据。如果你的列数更多，只需要在values和as里添加对应的字段名即可，扩展性很强。

内容的提问来源于stack exchange，提问作者Anugerah Erlaut