# Create Bar chart for array of nested objects

**URL:** <https://discuss.elastic.co/t/create-bar-chart-for-array-of-nested-objects/292403>\
**Category:** Kibana\
**Tags:** vega\
**Created:** [December 19, 2021, 2:55pm UTC](https://discuss.elastic.co/t/create-bar-chart-for-array-of-nested-objects/292403 "2021-12-19T14:55:55Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![masoud\_safa](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/masoud_safa/32/99286_2.png) [@masoud\_safa](https://discuss.elastic.co/u/masoud_safa)\
**Post date:** [December 19, 2021, 2:55pm UTC](https://discuss.elastic.co/t/create-bar-chart-for-array-of-nested-objects/292403/1 "2021-12-19T14:55:55Z")

</div>

Hi  
i have problem in drawing chart for my data with vega  
my data is like this

```auto
{
	"took": 10,
	"timed_out": false,
	"hits": {
		"hits": [
			{
				"_index": "request_index",
				"_id": "eaae227e-cf8f-411d-a8b3-0d66595d8730",
				"_source": {
					"creationDate": "2021-12-04T13:03:13.186Z",
					"requests": [
						{
							"searchEngine": "Google",
							"execTime": 235
						},
						{
							"searchEngine": "Bing",
							"execTime": 952
						}
					]
				}
			},
			{
				"_index": "request_index",
				"_id": "ac03a6de-23af-4e2d-9315-a36a82ffd251",
				"_source": {
					"creationDate": "2021-11-04T13:03:13.186Z",
					"requests": [
						{
							"searchEngine": "Yahoo",
							"execTime": 75
						},
						{
							"searchEngine": "Google",
							"execTime": 145
						},
						{
							"searchEngine": "Bing",
							"execTime": 170
						}
					]
				}
			}
		]
	}
}

```

I want to draw bar chart for average of execTime per searchEngine like this  
 ![Screenshot from 2021-12-19 18-22-31](https://us1.discourse-cdn.com/elastic/original/3X/3/f/3f70b98ad213ee97d341d6ce031d44fcd1051116.png)

and also historical average for execTime and split charts by searchEngine

can anyone help me?

---

<div class="post-metadata">

**Author:** ![rashmi](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/rashmi/32/16391_2.png) [@rashmi](https://discuss.elastic.co/u/rashmi)\
**Post date:** [December 20, 2021, 6:35pm UTC](https://discuss.elastic.co/t/create-bar-chart-for-array-of-nested-objects/292403/2 "2021-12-20T18:35:16Z")

</div>

copying @Marco_Liberati for some insights on this. Please help when you have time.

Thanks  
Rashmi

---

<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:** [December 20, 2021, 7:16pm UTC](https://discuss.elastic.co/t/create-bar-chart-for-array-of-nested-objects/292403/3 "2021-12-20T19:16:51Z")

</div>

See in [Vega Editor](https://vega.github.io/editor/#/url/vega/N4IgJAzgxgFgpgWwIYgFwhgF0wBwqgegIDc4BzJAOjIEtMYBXAI0poHsDp5kTykSArJQBWENgDsQAGhAB3GgBN6aACwAGNTPg0yWNACYNMnEgUKa4smgEyFSTClQBtUOKQI4aEA6YAbTzLESL4McBBooJhsbADWaACMmt40HgoA+mwMmGgAZsEQcFp04aigMMVoLiBpFgpwAB5eAE5wAI6hEJg14nWNMjUKXnBISHD6+gDscAC0UDkAHDnTKvHxCtNI80wAzNNqCgBsBwIAnAIK8xPbatLVYgxNUJ6lIFAt9uziACL2zyCG+ni03i+j2KgAKvFtqg1NCoZR4vMDgAtW4tdphTAlKoFJCPGAAUUsFj+AHFomR-LcGnAoOCUs99NsBABfKSgXH4om0cR-ABCFisMhpdIZaDO+hZAF0WWzQN1es02h0urUGrcBl4kFBYUgDnVpkykEsVGN1idtvEBBttgdNvocjkFPoBPENfdHs9QG9hphPj9MH8AUDVmDIdDYah4YiUWjlZjsRzhlzibyvABNJAwaLU+q0+keNATVnskCc2DckleclsSkBEAigvPeIqEtJvEV1P8wW5-NiqMTNTS2UytkgHJsJrIbIvHBNNg4OBNTAATy85SxlA34THmCaSHEEAnU8qkRXi68OV89kDkhkORocF8Cmxd0ynso6JV4SlMiQr6-BMQBlUtVwvdBjwQBhr1uf8vHLQku1zOcvDsTAGAQJwAHJAM6CAsKlbCEMrXkCJAOVvHPP5IOglA-xKBs81FQthXqFD0DQjDsNwrECOwxsGTIiiwL+JAyDIFoKEDW4JMyHAmDXZwy2TTseU8X9x0fZ9XwEwsNIXV8kFIfcyHU+jKkYvs9OHDToGCMJTxANxC3Qeo7KpGQRK8JgD0GWw2GQCwIhANDHG8JA-HrB8n0GdBiKQsd90sP55CUGBbhMMwexhSg1BsEB5wYHo0D3UIKOcv4V3c+sFACpAgpeUKvB8DzNJioYmKbciZHEGgnhKppQhkJLTPXOAdD0aU-zzRMQEnR9xBnEAmDYbAAtuaqvDcqB7O60B5rgRavH8HJshkTb0CqnaqSmkBkCaGJZq89AWigM7x3nBBgqa9AWs8MdDqgNg6mCw7AyaYLGheC6QG23b7y02LlI7RC1O6uRFGUaHrr+OHWp84qozHRSORxrwrvhtrnw6qz-pkFd9GCmGKdaoIQmeIcxwYHA0K9TTfF8YK2dCeDAyfPwRdlLQ2GM4KHwFoXghFl64EGWURxZIA). If you need explanation on how the data was transformed let me know @masoud_safa

```auto
{
  "$schema": "https://vega.github.io/schema/vega/v5.json",
  "width": 400,
  "height": 200,
  "padding": 5,
  "data": [
    {
      "name": "table",
      "values": {
        "took": 10,
        "timed_out": false,
        "hits": {
          "hits": [
            {
              "_index": "request_index",
              "_id": "eaae227e-cf8f-411d-a8b3-0d66595d8730",
              "_source": {
                "creationDate": "2021-12-04T13:03:13.186Z",
                "requests": [
                  {"searchEngine": "Google", "execTime": 235},
                  {"searchEngine": "Bing", "execTime": 952}
                ]
              }
            },
            {
              "_index": "request_index",
              "_id": "ac03a6de-23af-4e2d-9315-a36a82ffd251",
              "_source": {
                "creationDate": "2021-11-04T13:03:13.186Z",
                "requests": [
                  {"searchEngine": "Yahoo", "execTime": 75},
                  {"searchEngine": "Google", "execTime": 145},
                  {"searchEngine": "Bing", "execTime": 170}
                ]
              }
            }
          ]
        }
      },
      "format": {"property": "hits.hits"},
      "transform": [
        {"type": "flatten", "fields": ["_source.requests"], "as": ["requests"]},
        {
          "type": "formula",
          "as": "searchEngine",
          "expr": "datum['requests']['searchEngine']"
        },
        {
          "type": "formula",
          "as": "execTime",
          "expr": "datum['requests']['execTime']"
        },
        {
          "type": "aggregate",
          "groupby": ["searchEngine"],
          "fields": ["execTime"],
          "ops": ["average"],
          "as": ["execTime"]
        }
      ]
    }
  ],
  "scales": [
    {
      "name": "xscale",
      "type": "band",
      "domain": {"data": "table", "field": "searchEngine"},
      "range": "width",
      "padding": 0.05,
      "round": true
    },
    {
      "name": "yscale",
      "domain": {"data": "table", "field": "execTime"},
      "nice": true,
      "range": "height"
    }
  ],
  "axes": [
    {"orient": "bottom", "scale": "xscale"},
    {"orient": "left", "scale": "yscale"}
  ],
  "marks": [
    {
      "type": "rect",
      "from": {"data": "table"},
      "encode": {
        "enter": {
          "x": {"scale": "xscale", "field": "searchEngine"},
          "width": {"scale": "xscale", "band": 1},
          "y": {"scale": "yscale", "field": "execTime"},
          "y2": {"scale": "yscale", "value": 0}
        },
        "update": {"fill": {"value": "steelblue"}},
        "hover": {"fill": {"value": "red"}}
      }
    }
  ]
}

```

 ![image](https://us1.discourse-cdn.com/elastic/original/3X/7/2/72f2fa5ea30b6040c6fff4f38928dd0e9a2fec27.png)

---

<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:** [January 17, 2022, 7:17pm UTC](https://discuss.elastic.co/t/create-bar-chart-for-array-of-nested-objects/292403/4 "2022-01-17T19:17:20Z")

</div>

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