# BulletChartStyle

Canonical page: https://www.adaptabletools.com/docs/reference/bulletchartstyle

Style used to display a Bullet Chart in a Styled Column.

A Bullet Chart shows three things in a single cell:
 1. the actual cell value, as a horizontal bar (the "feature measure")
 2. a target value, as a marker on the bar (the "comparative measure")
 3. optional qualitative bands behind the bar (e.g. poor / ok / good),
 defined via the inherited `CellRanges` property

Note: Unlike `PercentBarStyle.CellRanges` (which colour the bar based on
the cell value), `BulletChartStyle.CellRanges` colour the *background*
bands and are drawn unconditionally to provide the qualitative scale.

```ts title="TypeScript"
export interface BulletChartStyle extends NumericStyledColumn 
```

###### Extends

[`NumericStyledColumn`](https://www.adaptabletools.com/docs/reference/numericstyledcolumn.md)

## Properties

| Property | Type | Description | Default |
| --- | --- | --- | --- |
| [BackColor](https://www.adaptabletools.com/docs/reference/bulletchartstyle.md#backcolor) | `string` | Background colour for the chart area when no `CellRanges` are supplied. |   |
| [Bar](https://www.adaptabletools.com/docs/reference/bulletchartstyle.md#bar) | [`BulletChartBarProperties`](https://www.adaptabletools.com/docs/reference/bulletchartbarproperties.md) | Visual properties of the actual (foreground) bar — colour and thickness. |   |
| [CellTextProperties](https://www.adaptabletools.com/docs/reference/bulletchartstyle.md#celltextproperties) | [`BarStyleCellTextProperties`](https://www.adaptabletools.com/docs/reference/barstylecelltextproperties.md) | Optional cell-text overlay configuration. |   |
| [Font](https://www.adaptabletools.com/docs/reference/bulletchartstyle.md#font) | [`CellFontStyle`](https://www.adaptabletools.com/docs/reference/cellfontstyle.md) | Optional cell-text styling (colour, weight, font, alignment, …) applied<br/>by the Bullet Chart renderer to the optional `CellText` overlay.<br/><br/>When set, this property &quot;claims&quot; the Font slice for the column: any<br/>Format Column matching this column has its Font properties stripped.<br/>When unset, Format Column Font properties inherit through normally. |   |
| [Orientation](https://www.adaptabletools.com/docs/reference/bulletchartstyle.md#orientation) | `'Horizontal' \| 'Vertical'` | Orientation of the chart.<br/><br/>- `'Horizontal'` (default) - bands and bar run left-to-right; markers<br/> are vertical lines / shapes positioned along the x-axis.<br/>- `'Vertical'` - bands and bar run bottom-to-top; markers are<br/> horizontal lines / shapes positioned along the y-axis.<br/><br/>Note: vertical bullet charts need a tall row height to be readable<br/>(we recommend at least 60px). AG Grid row height is a per-grid setting<br/>(`gridOptions.rowHeight` or `getRowHeight`). | &#39;Horizontal&#39; |
| [Origin](https://www.adaptabletools.com/docs/reference/bulletchartstyle.md#origin) | `'Auto' \| 'Zero' \| number` | Origin of the actual bar.<br/><br/>- `'Auto'` (default) - the bar grows from the left edge unless any cell<br/> value or range endpoint is negative, in which case it grows from `0`<br/>- `'Zero'` - the bar always grows from `0` (centred axis); positive<br/> values extend right, negative values extend left<br/>- any number - the bar grows from that fixed origin | &#39;Auto&#39; |
| [TargetProperties](https://www.adaptabletools.com/docs/reference/bulletchartstyle.md#targetproperties) | [`BulletChartTargetProperties`](https://www.adaptabletools.com/docs/reference/bulletcharttargetproperties.md) | Target value(s) rendered as marker(s) on the bar, plus the chart-level<br/>default marker style. Per-target overrides are possible via the<br/> object form. |   |
| [ToolTipText](https://www.adaptabletools.com/docs/reference/bulletchartstyle.md#tooltiptext) | [`CellTextOptions`](https://www.adaptabletools.com/docs/reference/celltextoptions.md) | Tooltip content - same tokens (`'CellValue'`, `'PercentageValue'`) as<br/>Percent Bar. |   |

## Property Details

### BackColor

Background colour for the chart area when no `CellRanges` are supplied.

```ts title="TypeScript"
BackColor?: string;
```

###### Property Value

`string`

### Bar

Visual properties of the actual (foreground) bar — colour and thickness.

```ts title="TypeScript"
Bar?: BulletChartBarProperties;
```

###### Property Value

[`BulletChartBarProperties`](https://www.adaptabletools.com/docs/reference/bulletchartbarproperties.md)

### CellTextProperties

Optional cell-text overlay configuration.

```ts title="TypeScript"
CellTextProperties?: BarStyleCellTextProperties;
```

###### Property Value

[`BarStyleCellTextProperties`](https://www.adaptabletools.com/docs/reference/barstylecelltextproperties.md)

### Font

Optional cell-text styling (colour, weight, font, alignment, …) applied
by the Bullet Chart renderer to the optional `CellText` overlay.

When set, this property &quot;claims&quot; the Font slice for the column: any
Format Column matching this column has its Font properties stripped.
When unset, Format Column Font properties inherit through normally.

```ts title="TypeScript"
Font?: CellFontStyle;
```

###### Property Value

[`CellFontStyle`](https://www.adaptabletools.com/docs/reference/cellfontstyle.md)

### Orientation

Orientation of the chart.

- `'Horizontal'` (default) - bands and bar run left-to-right; markers
 are vertical lines / shapes positioned along the x-axis.
- `'Vertical'` - bands and bar run bottom-to-top; markers are
 horizontal lines / shapes positioned along the y-axis.

Note: vertical bullet charts need a tall row height to be readable
(we recommend at least 60px). AG Grid row height is a per-grid setting
(`gridOptions.rowHeight` or `getRowHeight`).

```ts title="TypeScript"
Orientation?: 'Horizontal' | 'Vertical';
```

###### Default Value

&#39;Horizontal&#39;

###### Property Value

`'Horizontal' | 'Vertical'`

### Origin

Origin of the actual bar.

- `'Auto'` (default) - the bar grows from the left edge unless any cell
 value or range endpoint is negative, in which case it grows from `0`
- `'Zero'` - the bar always grows from `0` (centred axis); positive
 values extend right, negative values extend left
- any number - the bar grows from that fixed origin

```ts title="TypeScript"
Origin?: 'Auto' | 'Zero' | number;
```

###### Default Value

&#39;Auto&#39;

###### Property Value

`'Auto' | 'Zero' | number`

### TargetProperties

Target value(s) rendered as marker(s) on the bar, plus the chart-level
default marker style. Per-target overrides are possible via the
 object form.

```ts title="TypeScript"
TargetProperties?: BulletChartTargetProperties;
```

###### Property Value

[`BulletChartTargetProperties`](https://www.adaptabletools.com/docs/reference/bulletcharttargetproperties.md)

### ToolTipText

Tooltip content - same tokens (`'CellValue'`, `'PercentageValue'`) as
Percent Bar.

```ts title="TypeScript"
ToolTipText?: CellTextOptions;
```

###### Property Value

[`CellTextOptions`](https://www.adaptabletools.com/docs/reference/celltextoptions.md)