# Using Vega to create a Histogram with Global Mean

**URL:** <https://discuss.elastic.co/t/using-vega-to-create-a-histogram-with-global-mean/269335>\
**Category:** Kibana\
**Tags:** vega\
**Created:** [April 6, 2021, 1:55pm UTC](https://discuss.elastic.co/t/using-vega-to-create-a-histogram-with-global-mean/269335 "2021-04-06T13:55:04Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![AquaX](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/aquax/32/92006_2.png) [@AquaX](https://discuss.elastic.co/u/AquaX)\
**Post date:** [April 6, 2021, 1:55pm UTC](https://discuss.elastic.co/t/using-vega-to-create-a-histogram-with-global-mean/269335/1 "2021-04-06T13:55:04Z")

</div>

Hey everyone.  
EDIT: I'm using Kibana 7.11

I'm eventually trying to create one of these diagrams using Vega-Lite:

> **[Editor/IDE for Vega and Vega-Lite](https://vega.github.io/editor/#/examples/vega-lite/layer_histogram_global_mean)**
>
> The Vega editor is a web application for authoring and testing Vega and Vega-Lite visualizations. It includes a number of example specifications that showcase both the visual encodings and interaction techniques.

![image](https://us1.discourse-cdn.com/elastic/original/3X/0/c/0c1f466de93dfa2ec270c84b1c7c68fc3b556dc2.png)

It looks easy enough but I'm trying to use pre-aggregated data so I'm starting by just trying to get the histogram to appear.

Here is my Vega Spec:

```auto
{
  "$schema": "https://vega.github.io/schema/vega-lite/v4.json",
  "title": "Event counts from all indexes",
  "data": {
    "values": {
      "took": 58,
      "timed_out": false,
      "_shards": {
        "total": 1,
        "successful": 1,
        "skipped": 0,
        "failed": 0
      },
      "hits": {
        "total": 195729,
        "max_score": null,
        "hits": []
      },
      "aggregations": {
        "2": {
          "buckets": [
            {
              "key": 0,
              "doc_count": 79881
            },
            {
              "key": 1000000000,
              "doc_count": 13236
            },
            {
              "key": 2000000000,
              "doc_count": 2979
            },
            {
              "key": 3000000000,
              "doc_count": 5042
            },
            {
              "key": 4000000000,
              "doc_count": 51578
            },
            {
              "key": 5000000000,
              "doc_count": 26798
            },
            {
              "key": 6000000000,
              "doc_count": 6382
            },
            {
              "key": 7000000000,
              "doc_count": 2177
            },
            {
              "key": 8000000000,
              "doc_count": 1043
            },
            {
              "key": 9000000000,
              "doc_count": 641
            },
            {
              "key": 10000000000,
              "doc_count": 498
            },
            {
              "key": 11000000000,
              "doc_count": 428
            },
            {
              "key": 12000000000,
              "doc_count": 400
            },
            {
              "key": 13000000000,
              "doc_count": 373
            },
            {
              "key": 14000000000,
              "doc_count": 346
            },
            {
              "key": 15000000000,
              "doc_count": 271
            },
            {
              "key": 16000000000,
              "doc_count": 245
            },
            {
			NOTE:... [cut due to length]
              "key": 946000000000,
              "doc_count": 1
            }
          ]
        }
      }
    }
  },
  "transform": [
    {
      "flatten": [
        "aggregations.2.buckets"
      ],
      "as": [
        "buckets"
      ]
    }
  ],
  "mark": "bar",
  "encoding": {
    "x": {
      "field": "key",
      "bin": true,
      "type": "nominal"
    },
    "y": {
      "field": "doc_count",
      "type": "quantitative",
      "axis": {
        "title": "Document count"
      }
    }
  },
  "config": {
    "range": {
      "category": {
        "scheme": "elastic"
      }
    },
    "mark": {
      "color": "#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"
  },
  "width": "container",
  "height": "container",
  "autosize": {
    "type": "fit",
    "contains": "padding"
  }
}

```

Here is my Vega-Lite visualization:

```auto
    {
      $schema: https://vega.github.io/schema/vega-lite/v4.json
      title: Event counts from a single index
      data: {
        url: {
          %context%: true
          %timefield%: @timestamp
          index: kpis
          body: {
            aggs: {
              2: {
                histogram: {
                  field: duration
                  interval: 1000000000
                  min_doc_count: 0
                }
              }
            }
            size: 0
          }
          format: {
            property: aggregations.2.buckets
          }
        }
      }
      transform: [{
        flatten: ["aggregations.2.buckets"]
        as: ["buckets"]
      }]
      mark: bar
      encoding: {
        x: {
          field: key
          bin: true
          type: nominal
        }
        y: {
          field: doc_count
          type: quantitative
          axis: {
            title: Document count
          }
        }
      }
    }

```

I'm getting an error message like this:

```auto
    * Infinite extent for field "key": [Infinity, -Infinity]

    * Infinite extent for field "doc_count": [Infinity, -Infinity]

```

But I have no idea what I'm doing wrong...  
Anyone got any ideas?

Thanks in advance.

---

<div class="post-metadata">

**Author:** ![wylie](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/wylie/32/81794_2.png) [@wylie](https://discuss.elastic.co/u/wylie)\
**Post date:** [April 6, 2021, 2:32pm UTC](https://discuss.elastic.co/t/using-vega-to-create-a-histogram-with-global-mean/269335/2 "2021-04-06T14:32:08Z")

</div>

@AquaX the error message is telling you that you are using the wrong path. When I used the Inspector on your data, I see that you have flattened the fields with the parent path `buckets`. So you have `buckets.key` and `buckets.doc_count`, not `key` and `doc_count`.

---

<div class="post-metadata">

**Author:** ![aaron-nimocks](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/aaron-nimocks/32/73965_2.png) [@aaron-nimocks](https://discuss.elastic.co/u/aaron-nimocks)\
**Post date:** [April 6, 2021, 2:34pm UTC](https://discuss.elastic.co/t/using-vega-to-create-a-histogram-with-global-mean/269335/3 "2021-04-06T14:34:32Z")

</div>

I think using [format](https://vega.github.io/editor/#/url/vega-lite/N4IgJAzgxgFgpgWwIYgFwhgF0wBwqgegIDc4BzJAOjIEtMYBXAI0poHsDp5kTykBaADZ04JACyUAVhDYA7EABoQmOoLhoQAUVKzMAAihsGuiHoBmAJzYI9SQYL01ZAEzgAPOBEUhnSTClRQWSQEdXR-JjVvYjsGTzRQTDY2AGs0AFYADiUVUOcAfSNMNDM7CDglfIgYJAtnL0DlNn9BNABGJQgGKChPCDMGVtQOkAgUmhwcOGc0AAYlUpo1GdRZgF8lGDoGxOa7doBOdIB2ACYDpWQ3KsMLMNlBwU3ttABtAF0NkCQyMjuKFRyHYgU4JEBMbopOCYBqvUBQgCecyUzjYUHyhmMxVQxwOmUybQ28LgSOGs3JFIpKLRGKMunaAGZTgyAGxEkCItCnSk86nozH01DnXHszmoBk8yl82lYjKzMSnUUktBiSVUnw0gXY9JtE6ZJWk9Jq8nSrVclm4-UKYmklnG+Ya-l07EshmZRXWjnKnH203OrltY7HA1oTK+x0ywVteUMkOoA7h1FO2WoFliQmesXRxOa-2oMR4uNtbNqv0phVWm3tbnGsuC1XrTPetoS2sRs3i46xpuktoN0vtvMMsRsnvtI1tpOR7GnY4ZqvDO2T3Mp05idJxg4jnPJqNrT5rL5mNgWZDY0A4KxTCyYUnfX7-PzsWQQSinSgQqBQmEgQ+XWppOgTC1N4cCyIYzhOGQYJuGCZg0HAggrF6SJKEwThoJgFhxDkCJTBosjWE4+xfKSoDwYhyFTmauH4egACODBILodBPqQ3hIG4NDAiomBROgAAiaIMKEugGP6h6HkAA) vs a transform would be the way to go.

---

<div class="post-metadata">

**Author:** ![AquaX](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/aquax/32/92006_2.png) [@AquaX](https://discuss.elastic.co/u/AquaX)\
**Post date:** [April 6, 2021, 2:36pm UTC](https://discuss.elastic.co/t/using-vega-to-create-a-histogram-with-global-mean/269335/4 "2021-04-06T14:36:57Z")

</div>

Oh man! Such a simple solution 🙂

 ![image](https://us1.discourse-cdn.com/elastic/original/3X/e/e/ee0aecbe167567b997d815bd2c6ca41b8694c0c3.png)

Looks like that got me something. Thank you!

I can now add the layer with the global average.

---

<div class="post-metadata">

**Author:** ![AquaX](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/aquax/32/92006_2.png) [@AquaX](https://discuss.elastic.co/u/AquaX)\
**Post date:** [April 6, 2021, 2:37pm UTC](https://discuss.elastic.co/t/using-vega-to-create-a-histogram-with-global-mean/269335/5 "2021-04-06T14:37:52Z")

</div>

Good point! I'll make it more simple. Thank you!

---

<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:** [May 4, 2021, 2:38pm UTC](https://discuss.elastic.co/t/using-vega-to-create-a-histogram-with-global-mean/269335/6 "2021-05-04T14:38:28Z")

</div>

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