# Trouble showing data in Vega-lite

**URL:** <https://discuss.elastic.co/t/trouble-showing-data-in-vega-lite/180430>\
**Category:** Kibana\
**Tags:** vega\
**Created:** [May 9, 2019, 6:22pm UTC](https://discuss.elastic.co/t/trouble-showing-data-in-vega-lite/180430 "2019-05-09T18:22:03Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![BrunoSdeMenezes](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/brunosdemenezes/32/46413_2.png) [@BrunoSdeMenezes](https://discuss.elastic.co/u/BrunoSdeMenezes)\
**Post date:** [May 9, 2019, 6:22pm UTC](https://discuss.elastic.co/t/trouble-showing-data-in-vega-lite/180430/1 "2019-05-09T18:22:04Z")

</div>

Hello Everyone,

I'm trying to plot a vertical bar 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.4.0.json"
 mark: bar
 data: {
   url: {
     %context%: true
     %timefield%:_source.data_registrado_contrato
     index: trabalhista,
     body: {
       _source: ["diretoria", "data_registrado_contrato", "id_contrato"]
     }
   }
   format: { property: "hits.hits" }
 }
 transform: [
   {
     aggregate: [{
     op: count
     field: _source.id_contrato
     as: qtd
     }]
     groupby: ["_source.diretoria"]
   }
 ]
 encoding: {

   y:{
     field: qtd
     type: quantitative

   }
   x:{
     field: _source.diretoria
     type: nominal
   }
 }
}

```

And the mapping of my data:

```
{
  "took" : 1,
  "timed_out" : false,
  "_shards" : {
    "total" : 5,
    "successful" : 5,
    "skipped" : 0,
    "failed" : 0
  },
  "hits" : {
    "total" : 1499,
    "max_score" : 1.0,
    "hits" : [
      {
        "_index" : "trabalhista",
        "_type" : "data",
        "_id" : "AcwtemoBAxKStAaIEnOV",
        "_score" : 1.0,
        "_source" : {
          "id_contrato" : 8.0,
          "diretoria" : "Outras",
          "data_registrado_contrato" : "2016-01-24T00:00:00"
        }
      },
      {
        "_index" : "trabalhista",
        "_type" : "data",
        "_id" : "BMwtemoBAxKStAaIEnOV",
        "_score" : 1.0,
        "_source" : {
          "id_contrato" : 11.0,
          "diretoria" : "Comercial",
          "data_registrado_contrato" : "2014-08-01T00:00:00"
        }
      },
      {
        "_index" : "trabalhista",
        "_type" : "data",
        "_id" : "CcwtemoBAxKStAaIEnOV",
        "_score" : 1.0,
        "_source" : {
          "id_contrato" : 16.0,
          "diretoria" : "Industrial",
          "data_registrado_contrato" : "2018-09-10T00:00:00"
        }
      },
      {
        "_index" : "trabalhista",
        "_type" : "data",
        "_id" : "DMwtemoBAxKStAaIEnOW",
        "_score" : 1.0,
        "_source" : {
          "id_contrato" : 19.0,
          "diretoria" : "Provisão",
          "data_registrado_contrato" : "2015-12-08T00:00:00"
        }
      },
      {
        "_index" : "trabalhista",
        "_type" : "data",
        "_id" : "FcwtemoBAxKStAaIEnOW",
        "_score" : 1.0,
        "_source" : {
          "id_contrato" : 28.0,
          "diretoria" : "Demanda",
          "data_registrado_contrato" : "2015-02-09T00:00:00"
        }
      },
      {
        "_index" : "trabalhista",
        "_type" : "data",
        "_id" : "IMwtemoBAxKStAaIEnOW",
        "_score" : 1.0,
        "_source" : {
          "id_contrato" : 39.0,
          "diretoria" : "Terceiros",
          "data_registrado_contrato" : "2016-08-29T00:00:00"
        }
      },
      {
        "_index" : "trabalhista",
        "_type" : "data",
        "_id" : "I8wtemoBAxKStAaIEnOW",
        "_score" : 1.0,
        "_source" : {
          "id_contrato" : 42.0,
          "diretoria" : "Outras",
          "data_registrado_contrato" : "2016-07-12T00:00:00"
        }
      },
      {
        "_index" : "trabalhista",
        "_type" : "data",
        "_id" : "JMwtemoBAxKStAaIEnOW",
        "_score" : 1.0,
        "_source" : {
          "id_contrato" : 43.0,
          "diretoria" : "Industrial",
          "data_registrado_contrato" : "2019-03-05T00:00:00"
        }
      },
      {
        "_index" : "trabalhista",
        "_type" : "data",
        "_id" : "KswtemoBAxKStAaIEnOW",
        "_score" : 1.0,
        "_source" : {
          "id_contrato" : 49.0,
          "diretoria" : "Provisão",
          "data_registrado_contrato" : "2015-08-24T00:00:00"
        }
      },
      {
        "_index" : "trabalhista",
        "_type" : "data",
        "_id" : "L8wtemoBAxKStAaIEnOW",
        "_score" : 1.0,
        "_source" : {
          "id_contrato" : 54.0,
          "diretoria" : "Provisão",
          "data_registrado_contrato" : "2014-03-14T00:00:00"
        }
      }
    ]
  }
}

```

This is running on:  
Kibana 6.6.2

---

<div class="post-metadata">

**Author:** ![Nathan\_Reese](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/nathan_reese/32/84829_2.png) [@Nathan\_Reese](https://discuss.elastic.co/u/Nathan_Reese)\
**Post date:** [May 9, 2019, 6:47pm UTC](https://discuss.elastic.co/t/trouble-showing-data-in-vega-lite/180430/2 "2019-05-09T18:47:17Z")

</div>

Why are you doing the aggregation on the client side in vega? Your query to elasticsearch should preform the aggregation.

---

<div class="post-metadata">

**Author:** ![BrunoSdeMenezes](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/brunosdemenezes/32/46413_2.png) [@BrunoSdeMenezes](https://discuss.elastic.co/u/BrunoSdeMenezes)\
**Post date:** [May 9, 2019, 6:54pm UTC](https://discuss.elastic.co/t/trouble-showing-data-in-vega-lite/180430/3 "2019-05-09T18:54:57Z")

</div>

Hi Nathan, I'm kind new to Elastic...

Can you tell me how to do this? It's my first time using script to build this plot. Normally, I use the Kibana default options to create the views, but I'm trying to get more personalized view.

---

<div class="post-metadata">

**Author:** ![Nathan\_Reese](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/nathan_reese/32/84829_2.png) [@Nathan\_Reese](https://discuss.elastic.co/u/Nathan_Reese)\
**Post date:** [May 9, 2019, 7:22pm UTC](https://discuss.elastic.co/t/trouble-showing-data-in-vega-lite/180430/4 "2019-05-09T19:22:24Z")

</div>

[https://www.elastic.co/guide/en/elasticsearch/reference/current/search-aggregations.html](https://www.elastic.co/guide/en/elasticsearch/reference/current/search-aggregations.html)

---

<div class="post-metadata">

**Author:** ![BrunoSdeMenezes](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/brunosdemenezes/32/46413_2.png) [@BrunoSdeMenezes](https://discuss.elastic.co/u/BrunoSdeMenezes)\
**Post date:** [May 15, 2019, 5:28pm UTC](https://discuss.elastic.co/t/trouble-showing-data-in-vega-lite/180430/6 "2019-05-15T17:28:56Z")

</div>

Back Again,

I've got how to build a plot with vertical bar using aggregations from Elastic, but now my problem is how to build a stacked bar plot?

I'm trying using this script:

```
{
  "$schema": "https://vega.github.io/schema/vega-lite/v2.4.0.json",
  "data": {
    "url": {
      "index": "trabalhista",
      "%context%": true,
      "_source": [
        "data_registrado_contrato",
        "diretoria",
        "id_contrato"
      ],
      "size":2000,
      "body": {}
    },
    "format": {"property": "hits.hits"}
  },
  "mark": "bar",
  "transform": [
    {
      "calculate": "toDate(datum._source['data_registrado_contrato'])",
      "as": "time"
    }
    
  ],
  "encoding": {
    "x": {
      "timeUnit": "year",
      "field": "time",
      "type": "ordinal",
      "axis": {"title": "Ano"}
    },
    "y":{
    },
    "color": {
      "field": "_source.diretoria",
      "type": "nominal",
      "legend": {"title": "Diretorias"}
    }
  }
}

```

The "y" axis is missing because I've tried almost all examples I found, but no one seems to work.

Also tried using this as aggregation:

```
{
  "aggs":{
    "meus_buckets":{
      "composite": {
        "sources":[
          {"data": {"date_histogram": {"field": "data_registrado_contrato", "interval": "year"}}},
          {"diretoria": {"terms": {"field": "diretoria.keyword"}}}
          ]
      }
    }
  },
  "size":0
}

```

Changing the format and the fields of axes, but no success neither.

Can someone help me?

---

<div class="post-metadata">

**Author:** ![thekm1](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/thekm1/32/35926_2.png) [@thekm1](https://discuss.elastic.co/u/thekm1)\
**Post date:** [June 5, 2019, 3:43pm UTC](https://discuss.elastic.co/t/trouble-showing-data-in-vega-lite/180430/7 "2019-06-05T15:43:55Z")

</div>

Hi @BrunoSdeMenezes  
Is it maybe you are missing the sclale-\>range field inside color element? Like in this [example](https://vega.github.io/vega-lite/docs/bar.html#stack)  
I am not really used to vega-lite, but have some expirience in vega. Not sure if you want to here a solution in vega but you could almost follow this [example to create a stacked barchart](https://vega.github.io/vega/examples/stacked-bar-chart/).

Hope you get a step forward to the solution.

---

<div class="post-metadata">

**Author:** ![BrunoSdeMenezes](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/brunosdemenezes/32/46413_2.png) [@BrunoSdeMenezes](https://discuss.elastic.co/u/BrunoSdeMenezes)\
**Post date:** [June 5, 2019, 5:07pm UTC](https://discuss.elastic.co/t/trouble-showing-data-in-vega-lite/180430/8 "2019-06-05T17:07:51Z")

</div>

Hi @thekm1 actually i've got a solution and worked fine.

Thanks.

---

<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:** [July 3, 2019, 5:08pm UTC](https://discuss.elastic.co/t/trouble-showing-data-in-vega-lite/180430/9 "2019-07-03T17:08:08Z")

</div>

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