---
title: "OHLC"
description: "Open-High-Low-Close bars. What the ohlc is for, the data it needs and every option it has."
section: "Widgets"
canonical: "https://banksync.io/docs/widgets/chart-ohlc"
specs: ["dashboards"]
operationBindings: [{"capability":"dashboards","operation":"dashboards.author"}]
---

Open-High-Low-Close bars. It sits in the **Financial** group of the widget library.

![Example ohlc on a BankSync dashboard](https://cdn.banksync.io/screenshots/docs/charts/ohlc.7c9ab495f0fd3c9d.png)

## When to use it

An OHLC chart draws each period as a vertical bar from low to high, with a tick on the left for the open and on the right for the close. It answers "how did this holding trade each day?" with lighter marks than a candlestick.

## When to pick something else

- Want filled bodies, or a volume pane? Use a **Candlestick**.
- Only the closing price matters? Use a **Line chart**.
- Want the busiest price levels? Use a **Volume profile**.

## The data it needs

Pick these in the **Data** tab of the inspector. BankSync suggests a column for each when your source has an obvious match.

| Field    | Needed | Pick   | Notes                                                                              |
| -------- | ------ | ------ | ---------------------------------------------------------------------------------- |
| **Date** | Yes    | a date | Open/High/Low/Close are read from columns named o/h/l/c — shape them in the query. |

Each row is drawn as it is, so shape the rows first if you need totals. See [Shaping data](/docs/dashboards/dashboards-shaping-data).

## OHLC options

Set these on the **Style** tab of the inspector. "Automatic" means BankSync picks a value from the chart's size and data.

| Option             | What it does                                                           | Values            | New charts start with |
| ------------------ | ---------------------------------------------------------------------- | ----------------- | --------------------- |
| **Rising colour**  | Colour for periods that closed higher than they opened.                | Colour            | `#16a34a`             |
| **Falling colour** | Colour for periods that closed lower than they opened.                 | Colour            | `#dc2626`             |
| **Tick length**    | Length of the open and close ticks on each side of the bar, in pixels. | Number, 0 or more | Automatic             |
| **Line width**     | Thickness of the high-to-low bar and its ticks, in pixels.             | Number, 0 or more | Automatic             |

### Needs history

Show a note instead of the chart until the rows cover enough periods, so a first week never reads as a trend.

| Option              | What it does                                                                       | Values                          | New charts start with |
| ------------------- | ---------------------------------------------------------------------------------- | ------------------------------- | --------------------- |
| **Date field**      | The date column whose distinct periods are counted.                                | Text                            | Automatic             |
| **Period**          | What counts as one period: a day, week, month, quarter or year.                    | Day, Week, Month, Quarter, Year | Automatic             |
| **Periods needed**  | How many distinct periods the rows must cover before the chart draws (2 to 60).    | Whole number, 2 to 60           | Automatic             |
| **Waiting message** | Shown until there is enough history. Leave empty for a message naming the periods. | Text, up to 120 characters      | Automatic             |

## Shared chart styling

Every chart also has the shared styling options. These apply to this one:

- [Legend](/docs/widgets/chart-styling#legend): position, layout and which series show.
- [Axes](/docs/widgets/chart-styling#axes): titles, tick labels and number format.
- [Grid](/docs/widgets/chart-styling#grid), [title](/docs/widgets/chart-styling#title), [padding](/docs/widgets/chart-styling#padding) and [background](/docs/widgets/chart-styling#background).
- [Value labels](/docs/widgets/chart-styling#value-labels) on the marks.
- [Categories and labels](/docs/widgets/chart-styling#categories-and-labels): top N with "Other", sort order, readable labels, the handwritten callout.
- [Style](/docs/widgets/chart-styling#style): corner radius, line width, opacity and animation.
- [Tooltip](/docs/widgets/chart-styling#tooltip) on hover.
- Click to filter: clicking a mark can filter the rest of the dashboard. See [Filters and cross-filtering](/docs/dashboards/filters-and-cross-filtering).
- [Colours](/docs/widgets/chart-styling#palette): follow the dashboard palette or pick one for this chart.

## Messy data

- It needs a date and open, high, low and close columns, one row per period. Transaction data doesn't have these.
- A row missing any of the four prices is dropped. With none left you see "No complete price rows to show".
- If the high sits below the open or close, or the low sits above them, the bar is stretched to cover both.
- Rows are sorted by date, and gaps such as weekends take no space.
- The price axis fits your price range instead of starting at zero.

## On a phone

The ticks need horizontal room. With too many periods for the width, the chart switches to a close-price line with a crosshair. On a phone, show a few weeks of daily bars or switch to weekly periods.

## Related charts

- [Candlestick](/docs/widgets/chart-candlestick): OHLC price candles
- [Volume profile](/docs/widgets/chart-volume-profile): Volume traded per price
- [Waterfall](/docs/widgets/chart-waterfall): Walk from a start to an end amount, step by step (P\&L, net-worth change)