Appearance
Personalize your experience
QuaTick Charts API
12 chart types · 100+ indicators · WebGL rendering · WebSocket streaming. Self-hostable. TypeScript-native.
The same engine powering QuaTick's trading platform — now available as a standalone SDK.
Chart Types
Technical Indicators
Data Points Supported
Tick-to-Render
Every Chart Type You Need
Each chart updates live below — streaming simulated tick data at 60 FPS.
High-performance OHLCV candlestick rendering with wicks, bodies, zoom, pan and crosshair support.
chart.addSeries({ type: 'candlestick', data: ohlcv });Options Payoff Chart
A fully standalone payoff diagram engine — P&L curves at expiry, target-date curves, breakevens, SD bands, OI overlay, and smooth pan/zoom. No OHLCV data required.
Interactive payoff diagram with breakeven markers, ±1σ and ±2σ standard deviation bands. Drag to pan, scroll to zoom. Hover for real-time P&L readout.
createPayoffChart({ container, theme: 'dark' })import { createPayoffChart, calculatePayoffChartData } from '@quatick/quatick-charts';
const chart = createPayoffChart({ container: '#payoff', height: 420, theme: 'dark' });
const data = calculatePayoffChartData(legs, spotPrice, impliedVol, daysToExpiry);
chart.setData(data); // renders P&L curves, breakevens and SD bands instantlyEngine Capabilities
Everything you need to build professional trading interfaces.
12 Chart Types
Candlestick, Renko, P&F, Kagi, Line Break, Heikin-Ashi, Area, Baseline, HL, Volume-Candle, Step-Line, Line.
100+ Indicators
SMA, EMA, RSI, MACD, Bollinger Bands, Ichimoku, VWAP, Stochastic, ATR and 90+ more built-in.
Drawing Tools
Trendlines, Fibonacci, horizontal levels, pitchforks, annotations and custom shapes.
Multi-Timeframe
1s, 1m, 5m, 15m, 1h, 4h, 1D, 1W — synchronized multi-chart views with shared crosshair.
WebSocket Streaming
Real-time tick data. Incremental rendering keeps FPS constant at 1 000 ticks/s.
Custom Overlays
Render custom overlays, shapes and annotations onto the canvas with a simple draw API.
Heatmap Charts
Options OI heatmaps, market-cap treemaps and sector heatmaps — all built-in.
WebGL Rendering
GPU-accelerated canvas rendering for ultra-smooth performance with 1M+ data points.
Web Worker Calcs
All 100+ indicator calculations run off the main thread in Web Workers.
Precise Price Axis
Auto-scaling price axis with configurable precision, log scale and inverted-Y support.
Volume Profile
VWAP, POC and value-area levels rendered as horizontal histogram on the price axis.
Strategy Overlay
Overlay backtest entry/exit markers, equity curves and drawdown bands on any series.
Quick Integration
Install via npm and render in under 10 lines of TypeScript.
import { createChart } from '@quatick/charts';
const chart = createChart({
container: '#chart-container',
theme: 'dark',
xAxis: { position: 'bottom' },
yAxis: { position: 'right', precision: 2 },
interactions: { enableZoom: true, enablePan: true, enableCrosshair: true },
});
chart.addSeries({ type: 'candlestick', name: 'NIFTY 50', data: ohlcvData });
chart.addSeries({ type: 'line', name: 'SMA-20', data: sma20Data, color: '#8b5cf6' });
chart.render();Performance Benchmarks
< 16ms
Render Time
60 FPS guaranteed
1M+
Data Points
Handle massive datasets
< 5ms
Indicators
Calculation latency
< 50ms
WebSocket
Tick-to-render latency
Architecture Overview
Data Layer
WebSocket to exchange feeds. Normalized OHLCV pipeline. Historical data API with pagination and caching.
Compute Engine
100+ indicators in Web Workers. Incremental computation for streaming. Object-pool memory management.
Render Pipeline
WebGL-accelerated canvas. Virtual viewport with lazy loading. Layer compositor for overlays. 60 FPS at 1M+ points.
Ready to build with QuaTick Charts?
Start free. 10 000 API calls/month included with every account.
No credit card required · MIT license