如何从Vega-Lite字段提取特定数据并实现鼠标悬停展示？

嘿，作为也在Kibana里折腾过Vega-Lite的开发者，我完全懂你刚接触时摸不清深层机制的困惑！下面分两部分帮你搞定这两个核心需求：

一、从字段中提取特定数据 #

在Vega-Lite里，**transform（数据变换）**是处理字段提取的核心工具，常用calculate或正则匹配来实现，给你两个实际场景的例子：

场景1：从字符串字段中提取子内容 #

比如你的Kibana索引里有个request_path字段，格式是/order/4567/pay，想要提取中间的订单ID：

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "data": {
    "url": {
      "%context%": true,
      "%timefield%": "@timestamp",
      "index": "your-kibana-index-name"
    }
  },
  "transform": [
    {
      "calculate": "regexp_match(datum.request_path, /\\/order\\/(\\d+)\\/pay/)[1]",
      "as": "order_id"
    }
  ],
  // 后续的mark和encoding配置...
}

这里用regexp_match匹配正则表达式，提取分组内的数字，存为新字段order_id。

场景2：从嵌套JSON字段中提取属性 #

如果字段是嵌套JSON结构（比如user_profile字段是{"nickname": "小李", "level": 3}），直接用点语法就能提取：

"transform": [
  {
    "calculate": "datum.user_profile.nickname",
    "as": "user_nick"
  },
  {
    "calculate": "datum.user_profile.level",
    "as": "user_level"
  }
]

二、实现鼠标悬停展示数据（Tooltip） #

Vega-Lite的Tooltip配置非常灵活，分两种常用方式：

方式1：启用默认Tooltip #

最简单的方式是在mark里开启tooltip，它会自动展示你在encoding中用到的所有字段：

"mark": {
  "type": "circle",
  "tooltip": true
},
"encoding": {
  "x": {"field": "@timestamp", "type": "temporal"},
  "y": {"field": "latency", "type": "quantitative"},
  "color": {"field": "order_id", "type": "nominal"}
}

鼠标悬停在数据点上时，会自动显示时间、延迟、订单ID这些信息。

方式2：自定义Tooltip内容 #

如果你想精准控制Tooltip展示的字段、标题和格式，就用自定义配置：

"mark": "circle",
"encoding": {
  "x": {"field": "@timestamp", "type": "temporal"},
  "y": {"field": "latency", "type": "quantitative"},
  "tooltip": [
    {"field": "@timestamp", "type": "temporal", "title": "请求时间"},
    {"field": "latency", "type": "quantitative", "title": "延迟(ms)", "format": ".1f"},
    {"field": "user_nick", "type": "nominal", "title": "用户昵称"}
  ]
}

这样Tooltip会严格按照你定义的字段顺序、标题和格式展示，完全贴合你的需求。

另外要注意，在Kibana环境中使用时，确保数据源配置正确（指定了正确的索引和时间字段），提取的字段在Kibana中是可访问的哦！

内容的提问来源于stack exchange，提问作者Diamant Eméraude