# Not able to display percentage in pie chart creating in vega **URL:** \ **Category:** Kibana\ **Tags:** vega\ **Created:** [March 18, 2021, 11:55am UTC](https://discuss.elastic.co/t/not-able-to-display-percentage-in-pie-chart-creating-in-vega/267649 "2021-03-18T11:55:09Z")\ **Posts on this page:** 6\ **Page:** 1
**Author:** ![saumya1](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/saumya1/32/87139_2.png) [@saumya1](https://discuss.elastic.co/u/saumya1)\ **Post date:** [March 18, 2021, 11:55am UTC](https://discuss.elastic.co/t/not-able-to-display-percentage-in-pie-chart-creating-in-vega/267649/1 "2021-03-18T11:55:10Z")
```auto { "$schema": "https://vega.github.io/schema/vega-lite/v4.json", "description": "A simple pie chart with labels.", "data": { "values": [ {"server_name": "server_1","status": "up","up":1,"down":0}, {"server_name": "server_1","status": "down","up":0,"down":1}, {"server_name": "server_1","status": "down","up":0,"down":1}, {"server_name": "server_1","status": "up","up":1,"down":0}, {"server_name": "server_1","status": "up","up":1,"down":0}, {"server_name": "server_1","status": "up","up":1,"down":0}, {"server_name": "server_1","status": "down","up":0,"down":1} ] }, "transform": [ { "aggregate": [ { "op": "count", "field": "status", "as": "a_count" }, { "op": "mean", "field": "up", "as": "a_sum" } ], "groupby": ["status"] },{ "calculate": "datum.a_count*datum.a_sum" , "as": "PercentOfTotal" } ], "encoding": { "theta": {"field": "PercentOfTotal", "type": "quantitative", "stack": true}, "color": {"field": "status", "type": "nominal"} }, "layer": [{ "mark": {"type": "arc", "outerRadius": 80} }, { "mark": {"type": "text", "radius": 90,"fontSize":20}, "encoding": { "text": {"field": "status", "type": "nominal"} } }, { "mark": {"type": "text", "radius": 120,"fontSize":20}, "encoding": { "text": {"field": "", "type": "nominal"}, } }], "view": {"stroke": null} } ``` ---
**Author:** ![Felix\_Roessel](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/felix_roessel/32/41623_2.png) [@Felix\_Roessel](https://discuss.elastic.co/u/Felix_Roessel)\ **Post date:** [March 19, 2021, 3:14pm UTC](https://discuss.elastic.co/t/not-able-to-display-percentage-in-pie-chart-creating-in-vega/267649/2 "2021-03-19T15:14:30Z")
This vega example may help you > **[Vega Compound Gauge at elastic content share](https://elastic-content-share.eu/downloads/vega-compound-gauge/)** > > This is a compund gauge visualization made with Vega. Its very helpful for visualization of percentage values. ---
**Author:** ![saumya1](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/saumya1/32/87139_2.png) [@saumya1](https://discuss.elastic.co/u/saumya1)\ **Post date:** [March 22, 2021, 4:30am UTC](https://discuss.elastic.co/t/not-able-to-display-percentage-in-pie-chart-creating-in-vega/267649/3 "2021-03-22T04:30:25Z")
{ "$schema": "[https://vega.github.io/schema/vega/v4.json](https://vega.github.io/schema/vega/v4.json)", "description": "A simple pie chart with embedded data.", "autosize":"none", "width": 200, "height": 200, "data": [ { "name": "table", "values": [ {"downloads": 7,"product": "CEP"}, {"downloads": 2,"product": "DAS"}, {"downloads": 5,"product": "ML"}, {"downloads": 7,"product": "ESB"} ] }, { "name": "summary", "source": "table", "transform": [ { "type": "aggregate", "summarize": {"downloads": "sum"} } ] }, { "name": "layout", "source": "table", "transform": [ {"type": "cross", "with": "summary"}, {"type": "pie","field": "a.downloads"}, { "type": "formula", "as": "percentage", "expr": "datum.a.downloads / datum.b.sum\_downloads \* 100" } ] } ], "scales": [ { "name": "r", "type": "sqrt", "domain": {"data": "layout","field": "a.downloads"} }, { "name": "color", "type": "ordinal", "domain": {"data": "layout","field": "a.product"}, "range": {"scheme":"category10"} } ], "marks": [ { "type": "arc", "from": {"data": "layout"}, "properties": { "update": { "x": {"field": {"group": "width"},"mult": 0.5}, "y": {"field": {"group": "height"},"mult": 0.5}, "startAngle": {"field": "layout\_start"}, "endAngle": {"field": "layout\_end"}, "innerRadius": {"value": 0}, "outerRadius": {"value": 100}, "stroke": {"value": "#1"}, "fill": {"scale": "color","field": "a.product"}, "fillOpacity": {"value": 1} }, "hover": {"fillOpacity": {"value": 0.8}} } }, { "type": "text", "from": {"data": "layout"}, "properties": { "enter": { "x": {"field": {"group": "width"},"mult": 0.5}, "y": {"field": {"group": "height"},"mult": 0.5}, "radius": {"value": 140}, "theta": {"field": "layout\_mid"}, "fill": {"value": "#000"}, "align": {"value": "center"}, "baseline": {"value": "middle"}, "text": { "template": "{{datum.percentage | number:'.1f'}} %" } } } } ] } not getting any error but blank screen is coming as output . ---
**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:** [March 22, 2021, 1:53pm UTC](https://discuss.elastic.co/t/not-able-to-display-percentage-in-pie-chart-creating-in-vega/267649/4 "2021-03-22T13:53:46Z")
I'm not what all sure what you are trying to do but on first glace you are trying to use fields `layout_start` and `layout_end` which aren't in the data table `layout`. I am guessing you want `startAngle` and `endAngle`. But in the text mark area you are looking for `layout_mid` which I am not sure what you need for that. In addition to that your data table has `NaN` as the `percentage` so somewhere in your transformations it's not calculating correctly. ![image](https://us1.discourse-cdn.com/elastic/original/3X/e/6/e6e0eb3fbd76ff42a6030218d0e9105a2b2fdd30.png) ---
**Author:** ![saumya1](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/saumya1/32/87139_2.png) [@saumya1](https://discuss.elastic.co/u/saumya1)\ **Post date:** [March 23, 2021, 5:35am UTC](https://discuss.elastic.co/t/not-able-to-display-percentage-in-pie-chart-creating-in-vega/267649/5 "2021-03-23T05:35:11Z")
I have taken reference from this link > > > How to do arithmetic operations such as division on a field? I have seen for multiplication mult keyword is used as... and trying to implement the last one (pie chart with percentage ) ---
**Author:** ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)\ **Post date:** [April 20, 2021, 5:35am UTC](https://discuss.elastic.co/t/not-able-to-display-percentage-in-pie-chart-creating-in-vega/267649/6 "2021-04-20T05:35:56Z")
This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.