# Radial Bar Gauge

Radial Bar Charts are valuable in showing comparisons between categories by using circularly shaped bars. Also known as the circular bar chart, it is simply a typical bar chart plot represented on a polar coordinate system. JavaScript Radial Bar Charts are drawn by fixing a unique radius for each bar representing each data and each bar is judged by its angle. In ApexCharts, data can be represented on a radial bar chart in the various formats such as multiple radial bar charts, radial bar with an image, and even in semi-circular gauge forms.

{% hint style="info" %}
You can find a more in depth explanation about the radial bar gauge on [this ](https://apexcharts.com/javascript-chart-demos/radialbar-charts/)page: <https://apexcharts.com/javascript-chart-demos/radialbar-charts/>
{% endhint %}

![](/files/xfk4WQoIeQCWIRapjFo3)

<table><thead><tr><th width="150">Property Name</th><th width="122.61538461538461">Data type</th><th width="150">Type</th><th>Description</th></tr></thead><tbody><tr><td>Label</td><td>Text</td><td>Expression</td><td>Data display in the radial bar</td></tr><tr><td>Value</td><td>Number</td><td>Expression</td><td>Values display in radial bar</td></tr><tr><td>Chart Color</td><td>Text</td><td>Expression</td><td><p>Color for the charted value.</p><p>Only accepts either hex or rgb/rgba so make sure the datalist values are in one of these color formats</p></td></tr><tr><td>Show track</td><td>Boolean</td><td>Expression</td><td>Determines whether a track is used to show the full scale of the chart.</td></tr><tr><td>Track color</td><td>Text</td><td>Expression</td><td><p>Background color for the track.</p><p>Only accepts either hex or rgb/rgba so make sure the datalist values are in one of these color formats.</p></td></tr><tr><td>Height</td><td>Text</td><td>Expression</td><td><p>Can be set to auto, percentage of container or pixels. Default is auto.</p><p>Examples: "350" or "350px" or "50%" or "auto".</p></td></tr><tr><td>Width</td><td>Text</td><td>Expression</td><td>Can be set to percentage of container or pixels. Examples: "350" or "350px" or "50%".</td></tr><tr><td>Arc style</td><td>Text</td><td>Dropdown</td><td>Defines the arc style for the radialbar. (Full, half, half inverse, gap).</td></tr><tr><td>Hollow size</td><td>Number</td><td>Expression</td><td>Percentage of the chart that is the hollow section. (Default 30%)</td></tr><tr><td>Data label font size</td><td>Number</td><td>Expression</td><td>Sets the fontsize in px (default 16) of the label displayed in the chart. May cause clipping if too big.</td></tr><tr><td>Stroke width</td><td>Number</td><td>Expression</td><td><p>Determines the width of each stroke. The higher the number the thicker the stroke but less strokes will appear.</p><p>No strokes (full-filled) will appear at 0.</p><p>Default value: 0</p></td></tr></tbody></table>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.wem.io/platform/wemtipsandtricks/widgets/advanced-charts/radial-bar-gauge.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.