# Vega-Lite condition in Kibana unexpected behaviour

**URL:** <https://discuss.elastic.co/t/vega-lite-condition-in-kibana-unexpected-behaviour/306014>\
**Category:** Kibana\
**Tags:** vega\
**Created:** [May 31, 2022, 8:11am UTC](https://discuss.elastic.co/t/vega-lite-condition-in-kibana-unexpected-behaviour/306014 "2022-05-31T08:11:18Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![monicakp](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/monicakp/32/100500_2.png) [@monicakp](https://discuss.elastic.co/u/monicakp)\
**Post date:** [May 31, 2022, 8:11am UTC](https://discuss.elastic.co/t/vega-lite-condition-in-kibana-unexpected-behaviour/306014/1 "2022-05-31T08:11:18Z")

</div>

Hi.

I'm creating a custom visualization using Vega-Lite in Kibana. I have one rectangle per document in my index, and based on a field (flag) in the document color the box either red or green.

However, I've come across some strange behaviour, and would appreciate if anyone can explain if this is expected and if so how to deal with it, or if it might be a bug.

This is what I'd like my visualization to look like:

 ![Kibana_correct](https://us1.discourse-cdn.com/elastic/original/3X/f/e/fe22f01890fdcc187e069556f9cfa768d4e0fe19.jpeg)

However, when I use the following code, I only get green boxes (the defaul value if the condition is not met)

```auto
{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json"
  "data":
    {
      "name": "check_data",
      "url": {
        "index": "my_index",
        "body": {
          query: {
                bool: {
                  must: [
                    "%dashboard_context-must_clause%"
                  ]
                  must_not: [
                    "%dashboard_context-must_not_clause%"
                  ]
                  filter: [
                    "%dashboard_context-filter_clause%"
                  ]
                }
              }
          "size": 200
        }
      },
      "format": {"property": "hits.hits"}
    },
  "concat": [
    {
      "columns": 14,
      "facet": {
        "field": "_source.actor_cp_id",
        "title": "Status"
      },
      "spec": {
          "layer": [
            {
              "mark": {
                "type": "rect"
              },
              "width": 60,
              "height": 40,
              "encoding": {
                "href": {"field": "url"},
                "color": {
                  "condition":{"test": "datum['_source.alvorlig_feil'] == 1", "value" : "red"},
                  "value": "green"
                }
              }
            },
            {
              "mark": {
              "type": "text"
              },
              "encoding": {
                "text": {
                  "condition": {"test": "datum['_source.alvorlig_feil'] == 1", "value" : "Problem"},
                  "value": "OK"
                },
                "color": {
                  "value": "white"
                }
              }
            }
        ]
      }
    }
  ]
}

```

This code produces the following visualization:

 ![Kibana_error](https://us1.discourse-cdn.com/elastic/original/3X/f/1/f13eb89fb1d3d811ec1afbd5826381364e3bf350.jpeg)

Only when I include a mark where I use the field that is also part of the condition, does it seem like the condition is actually able to evaluated to true. Heres the code that gives the correct visualization shown in the start of this topic. Note the first mark which uses the field but is hidden behind the other layers (I do not wish to include the value of the field, as it is just a flag):

```auto
{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json"
  "data":
    {
      "name": "check_data",
      "url": {
        "index": "my_index",
        "body": {
          query: {
                bool: {
                  must: [
                    "%dashboard_context-must_clause%"
                  ]
                  must_not: [
                    "%dashboard_context-must_not_clause%"
                  ]
                  filter: [
                    "%dashboard_context-filter_clause%"
                  ]
                }
              }
          "size": 200
        }
      },
      "format": {"property": "hits.hits"}
    },
  "concat": [
    {
      "columns": 14,
      "facet": {
        "field": "_source.actor_cp_id",
        "title": "Status"
      },
      "spec": {
          "layer": [
            {
              "mark": {
              "type": "text",
              },
              "encoding": {
                "text": {"field": "_source.alvorlig_feil"},
                "color": {
                  "value": "white"
                }
              }
            },
            {
              "mark": {
                "type": "rect"
              },
              "width": 60,
              "height": 40,
              "encoding": {
                "href": {"field": "url"},
                "color": {
                  "condition":{"test": "datum['_source.alvorlig_feil'] == 1", "value" : "red"},
                  "value": "green"
                }
              }
            },
            {
              "mark": {
              "type": "text"
              },
              "encoding": {
                "text": {
                  "condition": {"test": "datum['_source.alvorlig_feil'] == 1", "value" : "Problem"},
                  "value": "OK"
                },
                "color": {
                  "value": "white"
                }
              }
            }
        ]
      }
    }
  ]
}

```

Expected? It seems like I somehow need to make the information in the field availabe to be evaluated? Any input is appreciated.

Thanks!

---

<div class="post-metadata">

**Author:** ![Tomo\_M](https://avatars.discourse-cdn.com/v4/letter/t/848f3c/32.png) [@Tomo\_M](https://discuss.elastic.co/u/Tomo_M)\
**Post date:** [June 1, 2022, 10:55am UTC](https://discuss.elastic.co/t/vega-lite-condition-in-kibana-unexpected-behaviour/306014/2 "2022-06-01T10:55:24Z")

</div>

`datum['_source.alvorlig_feil']` is right syntax?  
How about `datum['_source']['alvorlig_feil']` or `datum._source.alvorlig_feil`??

---

<div class="post-metadata">

**Author:** ![monicakp](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/monicakp/32/100500_2.png) [@monicakp](https://discuss.elastic.co/u/monicakp)\
**Post date:** [June 1, 2022, 11:15am UTC](https://discuss.elastic.co/t/vega-lite-condition-in-kibana-unexpected-behaviour/306014/3 "2022-06-01T11:15:19Z")

</div>

Thank you for the suggestion! This

```auto
datum._source.alvorlig_feil

```

seems to be the correct way to do it.

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)\
**Post date:** [June 29, 2022, 11:15am UTC](https://discuss.elastic.co/t/vega-lite-condition-in-kibana-unexpected-behaviour/306014/4 "2022-06-29T11:15:42Z")

</div>

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