# Bar chart with percentage labels on top of the bar

**URL:** https://discuss.elastic.co/t/bar-chart-with-percentage-labels-on-top-of-the-bar/365629
**Category:** Kibana
**Created:** [August 27, 2024, 2:51pm UTC](https://discuss.elastic.co/t/bar-chart-with-percentage-labels-on-top-of-the-bar/365629 "2024-08-27T14:51:52Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![NikiMouse](https://avatars.discourse-cdn.com/v4/letter/n/b5e925/32.png) [@NikiMouse](https://discuss.elastic.co/u/NikiMouse)
#### Post date: [August 27, 2024, 2:51pm UTC](https://discuss.elastic.co/t/bar-chart-with-percentage-labels-on-top-of-the-bar/365629/1 "2024-08-27T14:51:52Z")

</div>

Hi all,  
there are already a view topics regarding bar charts with percentage labels. But my requirements I didn't found.  
goal: I want to compare the average response time of different test runs by presenting the times separated by keywords (interface names). On the top of the bars should be a label with percentage of the y-value differences.

The attached screenshot shows more than thousand words.

 ![bar-chart_percentage_compareReport](https://us1.discourse-cdn.com/elastic/original/3X/2/b/2b31166957af14da405d71dd5d32314892a81de1.png)  
The "baseline-B" and "run-30" are two different test runs - each with hundrets of samples (each document contains "ResponseTime" as a number). Regarding the difference in percentage: the left bar of each group of bars is 100%, the percentage label shows the difference of the average response time in percentage and the background color (green, if \<= 100%; red, if \> 100%)

Questions:

- Is it possible to get such a chart?
- If so, how to do it?

Thank you in advance, Niko

---

<div class="post-metadata">

### Author: ![dadoonet](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/dadoonet/32/137187_2.png) [@dadoonet](https://discuss.elastic.co/u/dadoonet)
#### Post date: [August 27, 2024, 3:04pm UTC](https://discuss.elastic.co/t/bar-chart-with-percentage-labels-on-top-of-the-bar/365629/2 "2024-08-27T15:04:57Z")

</div>

Welcome!

I believe that the only way to do **exactly** what you want is by using [Vega or Vega-Lite in Kibana](https://www.elastic.co/guide/en/kibana/current/vega.html). 🙂

---

<div class="post-metadata">

### Author: ![NikiMouse](https://avatars.discourse-cdn.com/v4/letter/n/b5e925/32.png) [@NikiMouse](https://discuss.elastic.co/u/NikiMouse)
#### Post date: [August 29, 2024, 11:27am UTC](https://discuss.elastic.co/t/bar-chart-with-percentage-labels-on-top-of-the-bar/365629/3 "2024-08-29T11:27:40Z")

</div>

Thank you David,  
do you have additional hints for me, because I don't know Vega.  
BR, Niko

---

<div class="post-metadata">

### Author: ![dadoonet](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/dadoonet/32/137187_2.png) [@dadoonet](https://discuss.elastic.co/u/dadoonet)
#### Post date: [August 29, 2024, 12:00pm UTC](https://discuss.elastic.co/t/bar-chart-with-percentage-labels-on-top-of-the-bar/365629/4 "2024-08-29T12:00:17Z")

</div>

I'm afraid that I can't help more as I have a very limited knowledge about Vega 😅
