Skip to content
EliteChart

Series

Every series kind ChartForge can paint — line / candle / bar / area / Heikin-Ashi / Renko / Kagi / PointFigure / RangeBars / LineBreak / ElderImpulse.

A "series" is the visual representation of bars on the chart. The same Bar data flows through any series kind — only the renderer differs. EliteChart ships eleven kinds out of the box, each tuned for a different analytical question.

Quick example

code
'use client';
import { EliteChart } from '@elitechart/elitechart';
import '@elitechart/elitechart/styles.css';

export default function Page() {
  return (
    <div style={{ width: '100%', height: '100vh' }}>
      <EliteChart symbol="BTCUSD" timeframe="1h" kind="candle" />
    </div>
  );
}
View source on GitHub →

How it works

The series kind is held in useChartStore.kind. Switching it does not refetch data — the same Bar[] is rerendered through a different drawing strategy. Five of the eleven kinds (Renko, Kagi, PointFigure, RangeBars, LineBreak) are transformed series — they replace the original bars with a derived bar set on the way to the renderer. The transform is pure and runs on every viewport change.

The eleven kinds

KindVisualisesBest for
'line'close priceclean trend overview
'candle'OHLCclassic technical analysis
'bar'OHLC (Western)denser views, no fill
'area'close + filled areamacro trend at a glance
'heikin-ashi'smoothed OHLCtrend filtering
'renko'brick units of price movementnoise filtering
'kagi'reversal linespure trend direction
'point-figure'columns of X/Oclassic P&F
'range-bars'fixed-range barsvolatility-adjusted
'line-break'breakout linesbreakout strategies
'elder-impulse'colour-coded candlesElder's impulse system

Variations

Line chart

code
<EliteChart symbol="BTCUSD" timeframe="1h" kind="line" />

Heikin-Ashi for trend smoothing

code
<EliteChart symbol="BTCUSD" timeframe="1h" kind="heikin-ashi" />

Programmatic switch

code
import { useChartStore } from '@elitechart/elitechart';
useChartStore.getState().setKind('renko');

API

PropTypeNotes
kindSeriesKindone of the eleven values above
kind (store)useChartStore.kindmirrors prop, drives top-bar selector

The full union is exported as SeriesKind from @elitechart/elitechart.