Trouble showing data in Vega-lite

Elastic Stack Kibana
1

Hello Everyone,
I'm new to Vega-lite. I'm trying to plot a bar graph using Vega-lite getting data from an Index. But the data does not show up in the view, only the axes.

This is the script I'm using:

   {
      "$schema": "https://vega.github.io/schema/vega-lite/v2.json",
      "data": {
        "url": {
          "index": "my-index",
          "%context%": true,
          "size":2000,
          "body": {}
        },
        "format": {"property": "hits.hits"}
      },
      "mark": "bar",
      "transform": [
        {
          "calculate": "datum._source.property.a",
          "as": "a"
        },
        {
              "calculate": "datum._source.property.b",
              "as": "b"
            }
        
      ],
      "encoding": {
        "x": {
          "field": "a",
          "type": "ordinal",
          "axis": {"title": "A"}
        },
        "y":{
          "field": "b",
          "type": "temporal",
          "axis": {"title": "B"}
        }
      }
    }

And data looks like:

{
  "took" : 1,
  "timed_out" : false,
  "_shards" : {
    "total" : 5,
    "successful" : 5,
    "skipped" : 0,
    "failed" : 0
  },
  "hits" : {
    "total" : 1499,
    "max_score" : 1.0,
    "hits" : [
      {
        "_index" : "my-index",
        "_type" : "data",
        "_id" : "AcwtemoBAxKStAaIEnOV",
        "_score" : 1.0,
        "_source" : {
          "property" : {
                "a": 1,
                "b": 3
            }
        }
      },
      {
        "_index" : "my-index",
        "_type" : "data",
        "_id" : "BMwtemoBAxKStAaIEnOV",
        "_score" : 1.0,
        "_source" : {
          "property" : {
                "a": 2,
                "b": 2
            }
        }
      }
    ]
  }

I saw multiple posts with similar problem but authors have not posted the solution that worked for them. Requesting help from fellow community members.

2

Hi, welcome! Are you using Kibana 7.8 or prior? Vega debugging has gotten much easier in 7.10, where we introduced a debugging panel in the Kibana inspector. It looks like you're using an older version though.

I think you will get the best help if you provide a Vega-lite spec that we can copy+paste into the online Vega editor to test. Please follow the instructions here to ask for Vega help. You may need to follow the instructions on copying it from the browser console, instead of the Inspect tab.

1 Like
4

Here is the Vega Editor link and it works so that leads me to believe your query isn't returning the same data you posted.

How do you know what the data looks like?

Also you have "%context%": true, so if you have any filters set it could be the problem.

5

Hey Aaron, thank you so much for your reply.
I check the data via the response received in the developer panel.
After looking at the data I realised that the issue can be probably with the transform

Could you clarify the following please:

{
  "took" : 1,
  "timed_out" : false,
  "_shards" : {
    "total" : 5,
    "successful" : 5,
    "skipped" : 0,
    "failed" : 0
  },
  "hits" : {
    "total" : 1499,
    "max_score" : 1.0,
    "hits" : [
      {
        "_index" : "my-index",
        "_type" : "data",
        "_id" : "AcwtemoBAxKStAaIEnOV",
        "_score" : 1.0,
        "_source" : {
          "property" : {
                "a": 1,
                "b": {
                      "c": 2,
                      "d": 2
                 }
            }
        }
      },
      {
        "_index" : "my-index",
        "_type" : "data",
        "_id" : "BMwtemoBAxKStAaIEnOV",
        "_score" : 1.0,
        "_source" : {
          "property" : {
                "a": 2,
                "b": {
                      "c": 3,
                      "d": 4
                 }
            }
        }
      }
    ]
  }

(Edit: b is now a nested property)
If the data looks something like this then will the following transform work?

"transform": [
        {
          "calculate": "datum._source.property.b.c.",
          "as": "c"
        },
        {
              "calculate": "datum._source.property.b.d",
              "as": "d"
            }
        
      ],

Thank you in advance :slight_smile:

6

Hi Wylie, we are using Kibana 7.6.2

7

Based on your latest response it looks like you might have found the issue on your own. I don't think I can help you more unless you show what your VEGA_DEBUG.vegalite_spec contains from the browser console.

8

You have a . after c. Remove that and try again.

9

Hi, I tried but did not work. Thanks for identifying this typo.
Used Vega-editor for replicating what I am trying to do. I hope this helps me convey better.

Vega-Editor-Link

Unfortunately, I cannot share the exact data so I'm trying to replicate the use-case.

10

The spec you shared is pretty different from what you originally posted- there are several syntax errors. I removed the entire transform section because it didn't seem necessary?

{
  "$schema": "https://vega.github.io/schema/vega-lite/v2.json",
  "data": {
    "url": "https://api.npoint.io/186ffeef12c2cb4fd764",
    "format": {"property": "hits.hits"}
  },
  "mark": "bar",
  "encoding": {
    "x": {"field": "_source.property.b.c", "type": "ordinal", "axis": {"title": "A"}},
    "y": {"field": "_source.property.b.d", "type": "temporal", "axis": {"title": "B"}}
  }
}
2 Likes
11

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