grafana/docs/sources/packages_api/ui/bargauge.md

+++
# -----------------------------------------------------------------------
# Do not edit this file. It is automatically generated by API Documenter.
# -----------------------------------------------------------------------
title = "BarGauge"
keywords = ["grafana","documentation","sdk","@grafana/ui"]
type = "docs"
+++

## BarGauge class

<b>Signature</b>

```typescript
export declare class BarGauge extends PureComponent<Props> 
```
<b>Import</b>

```typescript
import { BarGauge } from '@grafana/ui';
```
<b>Properties</b>

|  Property | Modifiers | Type | Description |
|  --- | --- | --- | --- |
|  [defaultProps](#defaultprops-property) | <code>static</code> | <code>Partial&lt;Props&gt;</code> |  |

<b>Methods</b>

|  Method | Modifiers | Description |
|  --- | --- | --- |
|  [getCellColor(positionValue)](#getcellcolor-method) |  |  |
|  [render()](#render-method) |  |  |
|  [renderBarAndValue()](#renderbarandvalue-method) |  |  |
|  [renderBasicAndGradientBars()](#renderbasicandgradientbars-method) |  |  |
|  [renderRetroBars()](#renderretrobars-method) |  |  |

### defaultProps property

<b>Signature</b>

```typescript
static defaultProps: Partial<Props>;
```

### getCellColor method

<b>Signature</b>

```typescript
getCellColor(positionValue: TimeSeriesValue): CellColors;
```
<b>Parameters</b>

|  Parameter | Type | Description |
|  --- | --- | --- |
|  positionValue | <code>TimeSeriesValue</code> |  |

<b>Returns:</b>

`CellColors`

### render method

<b>Signature</b>

```typescript
render(): JSX.Element;
```
<b>Returns:</b>

`JSX.Element`

### renderBarAndValue method

<b>Signature</b>

```typescript
renderBarAndValue(): React.ReactNode;
```
<b>Returns:</b>

`React.ReactNode`

### renderBasicAndGradientBars method

<b>Signature</b>

```typescript
renderBasicAndGradientBars(): ReactNode;
```
<b>Returns:</b>

`ReactNode`

### renderRetroBars method

<b>Signature</b>

```typescript
renderRetroBars(): ReactNode;
```
<b>Returns:</b>

`ReactNode`