# Creating a Vertical bar from json

**URL:** <https://discuss.elastic.co/t/creating-a-vertical-bar-from-json/195994>\
**Category:** Kibana\
**Created:** [August 20, 2019, 7:57pm UTC](https://discuss.elastic.co/t/creating-a-vertical-bar-from-json/195994 "2019-08-20T19:57:58Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![aayushg](https://avatars.discourse-cdn.com/v4/letter/a/e9a140/32.png) [@aayushg](https://discuss.elastic.co/u/aayushg)\
**Post date:** [August 20, 2019, 7:57pm UTC](https://discuss.elastic.co/t/creating-a-vertical-bar-from-json/195994/1 "2019-08-20T19:57:58Z")

</div>

Hi -

I want to create a Vertical bar depicting count on Y-axis and State/status of files in X-axis. Hovering/Drilling down/Clicking on each bar should show files names. The state of files would be updated every hour.

I have created the below json format to visualize the state of file, (we can modify json schema or add additional jsons):

```
{
    "finaljson": [
        {
            "status": "stage1",
            "feeds": [
                "file1"
            ],
            "count": 1
        },
        {
            "status": "stage2",
            "feeds": [
                "file2",
                "file3",
                "file4",
                "file8"
            ],
            "count": 4
        },
        {
            "status": "stage3",
            "feeds": [],
            "count": 0
        },
        {
            "status": "stage4",
            "feeds": [
                "file5",
                "file6",
                "file7",
                "file9",
                "file10"
            ],
            "count": 5
        },
        {
            "status": "stage5",
            "feeds": [
                "file11",
                "file12,
            ],
            "count": 2
        }
    ]
}

```

We are using Version: 6.4.2, I am unable to create the required visualization, any guidance would help.

Thanks,

---

<div class="post-metadata">

**Author:** ![Brandon\_Kobel](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/brandon_kobel/32/14829_2.png) [@Brandon\_Kobel](https://discuss.elastic.co/u/Brandon_Kobel)\
**Post date:** [August 20, 2019, 9:44pm UTC](https://discuss.elastic.co/t/creating-a-vertical-bar-from-json/195994/2 "2019-08-20T21:44:42Z")

</div>

Hey @aayushg, you'll first want to get your documents into Elasticsearch. I'd highly recommend inserting a document per file, and allowing Elasticsearch to perform the aggregation for you. The following can be used in DevTools to bulk-import the data-set which you've described:

```auto
POST aayushg/_bulk
{ "index": {} }
{ "feed": "file1", "status": "stage1"}
{ "index": {} }
{ "feed": "file2", "status": "stage2"}
{ "index": {} }
{ "feed": "file3", "status": "stage2"}
{ "index": {} }
{ "feed": "file4", "status": "stage2"}
{ "index": {} }
{ "feed": "file5", "status": "stage2"}
{ "index": {} }
{ "feed": "file6", "status": "stage4"}
{ "index": {} }
{ "feed": "file7", "status": "stage4"}
{ "index": {} }
{ "feed": "file9", "status": "stage4"}
{ "index": {} }
{ "feed": "file10", "status": "stage4"}
{ "index": {} }
{ "feed": "file11", "status": "stage5"}
{ "index": {} }
{ "feed": "file12", "status": "stage5"}

```

 ![step1](https://us1.discourse-cdn.com/elastic/original/3X/f/2/f20a8bb838ebef8a9b9b6b87e779eaa1e5e9cf96.gif)

You'll then have to create an index-pattern in Kibana, so we can create a Visualization against this data. To do so, go to Management -\> Index Patterns -\> Create Index Pattern. Enter in the index pattern "aayushg", click Next and then Create Index Pattern.

 ![step2](https://us1.discourse-cdn.com/elastic/original/3X/f/b/fb806cb5c8031aab30b53656970874da9ebdc482.gif)

Now we can create the Visualization! Go to Visualize -\> Create New Visualization -\> Vertical Bar Chart -\> Select the aayushg index pattern. Click the plus sign under buckets -\> X-axis -\> Terms Aggregation on status.keyword. Save this visualization as "Stages".

 ![step3](https://us1.discourse-cdn.com/elastic/original/3X/7/f/7fd55f787ec8f90414611721a7865c0f2830fb85.gif)

The visualization will allow you to see the aggregate information, but it won't allow you to easily see the individual files. To accomplish this, we're going to create a separate "Saved Search" which shows the individual files, and add both of them to a Dashboard.

Click on Discover -\> Select the Feed field and Save this as "Feeds"

 ![step4](https://us1.discourse-cdn.com/elastic/original/3X/5/7/570324525d598f754187b76f2522cbdc288e188b.gif)

Click on Dashboard -\> Create New Dashboard -\> Add -\> Select the "Feeds" and "Stages" to add them to the Dashboard. Now when you click on one of the Stages bars, it'll filter the Feeds:

 ![step5](https://us1.discourse-cdn.com/elastic/original/3X/9/9/9906d92b95a84bf31ba230f584db1033eee6b3dc.gif)

---

<div class="post-metadata">

**Author:** ![aayushg](https://avatars.discourse-cdn.com/v4/letter/a/e9a140/32.png) [@aayushg](https://discuss.elastic.co/u/aayushg)\
**Post date:** [August 23, 2019, 6:36pm UTC](https://discuss.elastic.co/t/creating-a-vertical-bar-from-json/195994/3 "2019-08-23T18:36:49Z")

</div>

Awesome. Thanks much!

---

<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:** [September 20, 2019, 6:37pm UTC](https://discuss.elastic.co/t/creating-a-vertical-bar-from-json/195994/4 "2019-09-20T18:37:01Z")

</div>

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