Installation
$ pnpm dlx shadcn@latest add @chartcn/chartgpu/ohlc-chart
Usage
import { ChartcnOhlcChart } from "@/components/chart/ohlc-chart";<ChartcnOhlcChart config={chartConfig} data={data}>
<ChartcnOhlcChart.Grid />
<ChartcnOhlcChart.XAxis />
<ChartcnOhlcChart.YAxis />
<ChartcnOhlcChart.Legend />
<ChartcnOhlcChart.Tooltip />
<ChartcnOhlcChart.Ohlc barWidth="58%" stemWidth={1.5} />
</ChartcnOhlcChart>API Reference
| Prop | Type | Default |
|---|---|---|
data | readonly OHLCDataPoint[] | - |
config | ChartConfig | - |
animation | boolean | AnimationConfig | { duration: 700, easing: "cubicOut" } |
isLoading | boolean | false |
OHLC
| Prop | Type | Default |
|---|---|---|
barWidth | number | string | - |
stemWidth | number | 1 |
tickLength | number | string | "45%" |
priceLabel | boolean | CandlestickPriceLabelConfig | ChartGPU default |