# Create X Axis percentage chart of total

**URL:** <https://discuss.elastic.co/t/create-x-axis-percentage-chart-of-total/208373>\
**Category:** Kibana\
**Created:** [November 18, 2019, 6:45pm UTC](https://discuss.elastic.co/t/create-x-axis-percentage-chart-of-total/208373 "2019-11-18T18:45:03Z")\
**Posts on this page:** 1\
**Showing post:** 4

<div class="post-metadata">

**Author:** ![markus\_buchner](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/markus_buchner/32/57882_2.png) [@markus\_buchner](https://discuss.elastic.co/u/markus_buchner)\
**Post date:** [November 22, 2019, 2:51pm UTC](https://discuss.elastic.co/t/create-x-axis-percentage-chart-of-total/208373/4 "2019-11-22T14:51:24Z")

</div>

Got it working now with vega chart - here my code and the chart:

```
{
  $schema: https://vega.github.io/schema/vega-lite/v2.json
  title: SLA percentile evaluation

  // Define the data source
  data: {
    url: {
      %context%: true
      %timefield%: @timestamp
      index: logstash-xcb-db-sec-sla-performance
      body: {
        "aggs":{
        	"percent-percentiles":{
        		"percentiles":{
        			"field":"total_duration",
        			"percents":[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95,96,97,98,99],
        			"keyed":false
        		}
        	}
        }
        // Speed up the response by only including aggregation results
        size: 0
      }
    }
    format: {property: "aggregations.percent-percentiles.values"},
  },
transform: [
  {
    "calculate": "0.9",
    "as": "sla1"
  },
  {
    "calculate": "1.4",
    "as": "sla2"
  }
],

"layer": [
{
  mark: bar
  encoding: {
    x: {
      field: key
      type: quantitative
      axis: {title: "Percentiles", tickMinStep: 1}
    },
    y: {
      field: value
      type: quantitative
      axis: {title: "Seconds"}
    },
    "tooltip": [
              {
                "field": "key",
                "type": "quantitative"
              },
              {
                "field": "value",
                "type": "quantitative"
              }
            ],
    "color": {"value": "#008B8B"}
  }
},
{
  "mark": "rule",
  "encoding": {
    "y": {
      "aggregate": "mean",
      "field": "value",
      "type": "quantitative"
    },
    "color": {"value": "gray"},
    "size": {"value": 3},
    "tooltip": [{
      "aggregate": "mean",
      "field": "value",
      "type": "quantitative"
    }]
  }
},
{
  "mark": "rule",
  "encoding": {
    "y": {
      "aggregate": "mean",
      "field": "sla1",
      "type": "quantitative"
    },
    "color": {"value": "orange"},
    "size": {"value": 3},
    "tooltip": [{
      "aggregate": "mean",
      "field": "sla1",
      "type": "quantitative"
    }]
  } 
},
{
  "mark": "rule",
  "encoding": {
    "y": {
      "aggregate": "mean",
      "field": "sla2",
      "type": "quantitative"
    },
    "color": {"value": "firebrick"},
    "size": {"value": 3},
    "tooltip": [{
      "aggregate": "mean",
      "field": "sla2",
      "type": "quantitative"
    }]
  }
}]
}

```

The chart:

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

Greetings Max

---

_[View the full topic](https://discuss.elastic.co/t/create-x-axis-percentage-chart-of-total/208373)._
