Vega Lite / Kibana - 区域标记不显示任何值
Vega Lite / Kibana - Area Mark shows no values
我有一个非常简单的问题,但我是 Vega/Vega-Lite 的新手,教程示例对解决我的问题帮助不大。
当我尝试显示我的浮点值时,只有标记:Point/Bar 似乎有效。其他所有需要相邻点之间连接的东西似乎都失败了,比如“区域”或“线”。
为了将我的值连接到面积图,我错过了什么?
聚合?层?时间戳值计算有误吗?
{
"$schema": "https://vega.github.io/schema/vega-lite/v4.json",
"data": {
"url": {
"%context%": true,
"%timefield%": "@timestamp",
"index": "default-*",
"body": {"size": 10000, "_source": ["@timestamp", "numericData"]}
},
"format": {"property": "hits.hits"}
},
"transform": [
{"calculate": "toDate(datum._source['@timestamp'])", "as": "time"}
],
"vconcat": [
{
"width": 1200,
"mark": {"type": "area", "line": true, "point": true},
"encoding": {
"x": {
"field": "time",
"scale": {"domain": {"selection": "brush"}},
"type": "temporal",
"axis": {"title": ""}
},
"y": {
"field": "_source.numericData",
"type": "quantitative",
"scale": {"domain": [0, 10]}
}
}
},
{
"width": 1200,
"height": 60,
"mark": {"type": "area", "line": true, "point": true}, // <-- only points are rendered :(
"selection": {"brush": {"type": "interval", "encodings": ["x"]}},
"encoding": {
"x": {"field": "time", "type": "temporal"},
"y": {
"field": "_source.numericData",
"type": "quantitative",
"formatType": "String",
"axis": {"tickCount": 3, "grid": false}
}
}
}
]
}
点是可见的 - 值在那里,但区域没有被渲染,因为我怀疑,我需要告诉 Vega Lite 解释 Y 上的数字浮点值以解释整个时间域。
你没有分享你的数据,所以我只能猜测为什么会这样。但您可能会看到此结果的一个原因是您的数据中是否散布着空值。这是一个简单的例子 (open in editor):
{
"data": {
"values": [
{"x": 1, "y": 1},
{"x": 2, "y": null},
{"x": 3, "y": 2},
{"x": 4, "y": null},
{"x": 5, "y": 3},
{"x": 6, "y": null}
]
},
"mark": {"type": "area", "point": true, "line": true},
"encoding": {
"x": {"field": "x", "type": "quantitative"},
"y": {"field": "y", "type": "quantitative"}
}
}
与桥不同,线和面不是通过单个值定义的,而是通过相邻值定义的。因为没有成对的相邻非空值,所以没有绘制线或区域的地方。
如果是这种情况,您可以使用适当的过滤器变换 (open in editor) 删除空点:
{
"data": {
"values": [
{"x": 1, "y": 1},
{"x": 2, "y": null},
{"x": 3, "y": 2},
{"x": 4, "y": null},
{"x": 5, "y": 3},
{"x": 6, "y": null}
]
},
"transform": [{"filter": "isValid(datum.y)"}],
"mark": {"type": "area", "point": true, "line": true},
"encoding": {
"x": {"field": "x", "type": "quantitative"},
"y": {"field": "y", "type": "quantitative"}
}
}
我有一个非常简单的问题,但我是 Vega/Vega-Lite 的新手,教程示例对解决我的问题帮助不大。
当我尝试显示我的浮点值时,只有标记:Point/Bar 似乎有效。其他所有需要相邻点之间连接的东西似乎都失败了,比如“区域”或“线”。
为了将我的值连接到面积图,我错过了什么? 聚合?层?时间戳值计算有误吗?
{
"$schema": "https://vega.github.io/schema/vega-lite/v4.json",
"data": {
"url": {
"%context%": true,
"%timefield%": "@timestamp",
"index": "default-*",
"body": {"size": 10000, "_source": ["@timestamp", "numericData"]}
},
"format": {"property": "hits.hits"}
},
"transform": [
{"calculate": "toDate(datum._source['@timestamp'])", "as": "time"}
],
"vconcat": [
{
"width": 1200,
"mark": {"type": "area", "line": true, "point": true},
"encoding": {
"x": {
"field": "time",
"scale": {"domain": {"selection": "brush"}},
"type": "temporal",
"axis": {"title": ""}
},
"y": {
"field": "_source.numericData",
"type": "quantitative",
"scale": {"domain": [0, 10]}
}
}
},
{
"width": 1200,
"height": 60,
"mark": {"type": "area", "line": true, "point": true}, // <-- only points are rendered :(
"selection": {"brush": {"type": "interval", "encodings": ["x"]}},
"encoding": {
"x": {"field": "time", "type": "temporal"},
"y": {
"field": "_source.numericData",
"type": "quantitative",
"formatType": "String",
"axis": {"tickCount": 3, "grid": false}
}
}
}
]
}
点是可见的 - 值在那里,但区域没有被渲染,因为我怀疑,我需要告诉 Vega Lite 解释 Y 上的数字浮点值以解释整个时间域。
你没有分享你的数据,所以我只能猜测为什么会这样。但您可能会看到此结果的一个原因是您的数据中是否散布着空值。这是一个简单的例子 (open in editor):
{
"data": {
"values": [
{"x": 1, "y": 1},
{"x": 2, "y": null},
{"x": 3, "y": 2},
{"x": 4, "y": null},
{"x": 5, "y": 3},
{"x": 6, "y": null}
]
},
"mark": {"type": "area", "point": true, "line": true},
"encoding": {
"x": {"field": "x", "type": "quantitative"},
"y": {"field": "y", "type": "quantitative"}
}
}
与桥不同,线和面不是通过单个值定义的,而是通过相邻值定义的。因为没有成对的相邻非空值,所以没有绘制线或区域的地方。
如果是这种情况,您可以使用适当的过滤器变换 (open in editor) 删除空点:
{
"data": {
"values": [
{"x": 1, "y": 1},
{"x": 2, "y": null},
{"x": 3, "y": 2},
{"x": 4, "y": null},
{"x": 5, "y": 3},
{"x": 6, "y": null}
]
},
"transform": [{"filter": "isValid(datum.y)"}],
"mark": {"type": "area", "point": true, "line": true},
"encoding": {
"x": {"field": "x", "type": "quantitative"},
"y": {"field": "y", "type": "quantitative"}
}
}