Conditional setting of values in VEGA (for gantt chart)

Elastic Stack Kibana
1

I want to create gantt chat display where "end" bar is dependent on the application status.
If "status" is "Running" - I want to set endTime to "now()"
If "status" is "not Running" - I want to use endTime field from the index.
I created a simple example below and it is not working (the code is commented).
Is there a way to implement something like that?
{
"$schema": "https://vega.github.io/schema/vega-lite/v2.json",
"title": "Survey progress",
"data": {
"values": [
{"survey": "test1@host1",
"endTime": "2021-02-18T17:01:52.886696Z",
"startTime": "2021-02-18T17:01:52.886696Z",
"appDisplayName": "app1",
"status": "Running"},
{"survey": "test2@host2",
"endTime": "2021-02-25T13:15:05.501355Z",
"startTime": "2021-01-22T13:10:08.921617Z",
"appDisplayName": "app2",
"status" : "Successful"}
]
},
"transform": [
{"calculate": "now()","as": "end"}
],
"mark": "bar",
"encoding": {
"y": {"field": "survey","type": "ordinal"},
"x": {"field": "startTime","type": "temporal", axis:{title:"time"}},
"x2": {"field": "endTime"},
//"x2": {"condition": {
//"test": {
// "field" : "status",
//"equal" : "Running",
//"field" : "end"
//},
//"field":"endTime" }
//},
"color": {field:"appDisplayName", type:"nominal"}
}
}

2

You can do conditional logic in Vega expressions: Expressions | Vega

So maybe something like this: { calculate: "datum.status == 'Running' ? now() : toDate(datum.endtime)", as: "end" }

I think this matches your explanation of what you wanted, but you may need to tweak it

1 Like
3

Thanks for your suggestion. With some additional tweaking it worked.
I had to add additional transform to the endTime.

"transform": [
{"calculate": "toDate(datum.endTime)", "as": "qq"},
{"calculate": "datum.status == 'Running' ? now() : datum.qq", "as": "end" }
],

Another question I have is why startTime and endTime are displayed differently while they are defined exactly in the same format. See the attached image.

vega1
vega11638×1141 93.9 KB

4

Vega-Lite does an automatic rewriting of temporal scale data, like your X axis, to be time format. You have two options:

  1. Provide the qq field as your x axis field instead, to avoid the rewriting
  2. Apply a date format to your tooltip
1 Like
5

Adding formatting to the tooltip as you suggested works great.

"tooltip": [
{"field": "survey", "type": "ordinal", "title": "Seismic Survey"},
{"field": "startTime", "timeUnit" : "yearmonthdatehoursminutes", "title": "Start Time"},
{"field": "end", "timeUnit" : "yearmonthdatehoursminutes", "title": "End Time"}
]

6

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.