There is a bit of confusion about what is the _source datum and the created fields with the formula transformation.
I've cleaned up it a bit and now it looks fine at least on the vega editor online.
I've also slightly changed the way you get the Region as it looks like not always available in the labels object but can be part of the OrgHier object.
{
"$schema": "https://vega.github.io/schema/vega/v5.json",
"description": "An example of Cartesian layouts for a node-link diagram of hierarchical data.",
"width": 1000,
"height": 800,
"padding": 5,
"signals": [
{"name": "labels", "value": true, "bind": {"input": "checkbox"}},
{
"name": "layout",
"value": "tidy",
"bind": {"input": "radio", "options": ["tidy", "cluster"]}
},
{
"name": "links",
"value": "diagonal",
"bind": {
"input": "select",
"options": ["line", "curve", "diagonal", "orthogonal"]
}
},
{"name": "separation", "value": false, "bind": {"input": "checkbox"}}
],
"data": [
{
"name": "table",
"format": {"property": "hits.hits"},
"transform": [
{
"type": "formula",
"as": "OrgId",
"expr": "datum._source['labels.OrgId']"
},
{
"type": "formula",
"as": "Region",
"expr": "datum._source['labels.Region'] || datum._source.OrgHier.Region"
},
{
"type": "formula",
"as": "StoreNum",
"expr": "datum._source['labels.StoreNum']"
},
{
"type": "formula",
"as": "RegisterNum",
"expr": "datum._source['labels.RegisterNum']"
},
{
"type": "fold",
"fields": ["OrgId", "Region", "StoreNum", "RegisterNum"]
}
],
"values": {
"took": 11,
"timed_out": false,
"_shards": {"total": 23, "successful": 23, "skipped": 21, "failed": 0},
"hits": {
"total": 2706,
"max_score": 1,
"hits": [
{
"_index": "apm-retmon",
"_type": "_doc",
"_id": "FyUIoXgBJTwroTEjoWCu",
"_score": 1,
"_source": {
"@timestamp": "2021-04-05T07:56:40.636197100Z",
"hostname": "SIMPHONY3",
"client.geo.location": "41.378197,-81.462354",
"ServiceName": "POS_Application",
"ServiceSummary": "Xstore Application is down ",
"ServiceStatus": "2",
"labels.OrgId": "1000",
"labels.Country": "US",
"labels.StoreNum": "101",
"labels.LatLong": "41.378197,-81.462354",
"labels.RegisterNum": "2",
"labels.OpType": "Availability",
"OrgHier": {
"OrgId": 1000,
"RegsterNum": "2",
"Store": "101",
"District": "1",
"Region": "West"
},
"labels.AppType": "xstore",
"labels.AlertFlag": "No",
"StatusChangeTime": "2021-04-05T07:19:31.034Z",
"labels.Age": "37",
"ServiceDetail": [
{
"Xstore": "OFFLINE",
"JmxPort": "2020",
"ConnectionToPort": "OFFLINE"
}
]
},
"OrgId": "1000",
"StoreNum": "101",
"RegisterNum": "2",
"Region": "West"
}
]
},
"aggregations": {"time_buckets": {"buckets": []}}
}
},
{
"source": "table",
"name": "transformation",
"transform": [
{
"type": "formula",
"as": "id",
"expr": "datum.key == 'OrgId' ? datum.OrgId : datum.key == 'Region' ? join([datum.OrgId,datum.Region],'-') : datum.key == 'StoreNum' ? join([datum.OrgId, datum.Region, datum.StoreNum],'-') : datum.key == 'RegisterNum' ? join([datum.OrgId, datum.Region, datum.StoreNum, datum.RegisterNum],'-') : null"
},
{
"type": "formula",
"as": "parent",
"expr": "datum.key == 'OrgId' ? null : datum.key == 'Region' ? datum.OrgId : datum.key == 'StoreNum' ? join([datum.OrgId, datum.Region],'-') : datum.key == 'RegisterNum' ? join([datum.OrgId, datum.Region, datum.StoreNum],'-') : null"
},
{"type": "filter", "expr": "isDefined(datum.value)"},
{"type": "aggregate", "groupby": ["id", "parent"]},
{"type": "formula", "as": "label", "expr": "peek(split(datum.id,'-'))"}
]
},
{
"name": "tree",
"source": "transformation",
"transform": [
{"type": "stratify", "key": "id", "parentKey": "parent"},
{
"type": "tree",
"method": {"signal": "layout"},
"size": [{"signal": "height"}, {"signal": "width - 100"}],
"separation": {"signal": "separation"},
"as": ["y", "x", "depth", "children"]
}
]
},
{
"name": "links",
"source": "tree",
"transform": [
{"type": "treelinks"},
{
"type": "linkpath",
"orient": "horizontal",
"shape": {"signal": "links"}
}
]
}
],
"scales": [
{
"name": "color",
"type": "linear",
"range": {"scheme": "magma"},
"domain": {"data": "tree", "field": "depth"},
"zero": true
}
],
"marks": [
{
"type": "path",
"from": {"data": "links"},
"encode": {
"update": {"path": {"field": "path"}, "stroke": {"value": "#ccc"}}
}
},
{
"type": "symbol",
"from": {"data": "tree"},
"encode": {
"enter": {"size": {"value": 100}, "stroke": {"value": "#fff"}},
"update": {
"x": {"field": "x"},
"y": {"field": "y"},
"fill": {"scale": "color", "field": "depth"}
}
}
},
{
"type": "text",
"from": {"data": "tree"},
"encode": {
"enter": {
"text": {"field": "label"},
"fontSize": {"value": 9},
"baseline": {"value": "middle"}
},
"update": {
"x": {"field": "x"},
"y": {"field": "y"},
"dx": {"signal": "datum.children ? -7 : 7"},
"align": {"signal": "datum.children ? 'right' : 'left'"},
"opacity": {"signal": "labels ? 1 : 0"}
}
}
}
],
"config": {
"range": {"category": {"scheme": "elastic"}},
"arc": {"fill": "#54B399"},
"area": {"fill": "#54B399"},
"line": {"stroke": "#54B399"},
"path": {"stroke": "#54B399"},
"rect": {"fill": "#54B399"},
"rule": {"stroke": "#54B399"},
"shape": {"stroke": "#54B399"},
"symbol": {"fill": "#54B399"},
"trail": {"fill": "#54B399"},
"title": {"color": "#343741"},
"style": {
"guide-label": {"fill": "#69707d"},
"guide-title": {"fill": "#343741"},
"group-title": {"fill": "#343741"},
"group-subtitle": {"fill": "#343741"}
},
"axis": {
"tickColor": "#eef0f3",
"domainColor": "#eef0f3",
"gridColor": "#eef0f3"
},
"background": "transparent"
},
"autosize": {"type": "fit", "contains": "padding"}
}
