Vela README

The project's README from github.com/LuxAlgo/Vela. As one markdown file: README.md.

Vela™ by LuxAlgo

Vela™

Fast, extensible financial charts for the web.
Headless core · native WebGL2 renderer · batteries-included workspace · plugin SDK

npm version Downloads License

Homepage · Quick start · Documentation · Plugin SDK · Changelog · License

Vela™ renders interactive financial charts with its own native renderer (WebGL2, with a canvas2d fallback) and keeps the chart itself headless: drive it entirely from code, or drop in the workspace for a complete chart app in one call. Every layer (data providers, scripting engines, renderers) plugs in behind a public port and can be swapped without touching the rest.

What's in the box

Vela package layout

Installing

npm install @luxalgo/vela

Quick start

The fastest path is the workspace, a complete chart app in one call:

import { VelaWorkspace } from '@luxalgo/vela/workspace';
import { BinanceProvider } from '@luxalgo/vela/providers/binance';

const chart = new VelaWorkspace('#chart', {
    layout: false, // one chart; '2h' | '4' | '8' | … for a multi-chart grid
    symbol: 'BTCUSDT',
    timeframe: '60',
    live: true,
    theme: 'dark',
    providers: { binance: () => new BinanceProvider() },
    persist: true, // restore market, style, timezone, drawings and indicators from localStorage
});

Prefer full control? Use the headless core directly:

import { Vela } from '@luxalgo/vela';
import { BinanceProvider } from '@luxalgo/vela/providers/binance';

const chart = new Vela('#chart', { symbol: 'binance:BTCUSDT', timeframe: '60', live: true });
chart.data.registerProvider('binance', new BinanceProvider());
await chart.ready();

No provider, no network? Pass your own bars via the data option. See the quickstart.

Browser bundle

The package also ships self-contained browser builds for script-tag usage: dist/vela.global.js (readable, development) and dist/vela.global.min.js (minified, production). Either file attaches the library's public API, including the bundled providers, to window.Vela.

Indicators

Vela™ ships 70+ built-in studies — moving averages, bands and channels, momentum oscillators, trend and volatility measures, volume studies, and price-anchored overlays such as VWAP, SuperTrend, and Pivot Points. They compute from the chart's own bars (no scripting engine), and each one gets a legend row, a settings dialog, and persistence across reloads. Volume and the visible-range volume profile sit alongside them.

Custom scripts still run through pluggable engines. Vela™ ships none: install the addon for the language you want, or write one against the public ScriptingEngine port. Pine Script® lives in @luxalgo/vela-pinets (npm i @luxalgo/vela-pinets pinets), which is AGPL-3.0 because the PineTS runtime it executes is. Vela™ itself stays Apache-2.0 and carries no Pine code:

import { PineEngine } from '@luxalgo/vela-pinets';

chart.registerEngine('pine', new PineEngine());
chart.addIndicator(`//@version=6
indicator("EMA 20", overlay=true)
plot(ta.ema(close, 20), color=color.orange, linewidth=2)`);

Host tooling can execute-and-inject safely with chart.runIndicator(source) (structured errors, no dead legend rows) and read a running script's state, including its return value, via handle.context() (read-only snapshots, worker-safe). See the API reference, and Scripting engines for the addon and for writing your own.

The workspace takes an indicator manifest: inline JSON, a URL returning it, or an async loader (() => Promise<manifest>):

new VelaWorkspace('#chart', {
    // …
    engines: { pine: () => new PineEngine() },
    indicators: '/indicators.json', // or an inline [{ name, script | url, language?, enabled? }]
});

Extending (plugin SDK)

Custom chart types and canvas layers register through the public SDK, no fork needed:

import { registerChartType, registerRendererLayer } from '@luxalgo/vela/plugin';

// A new price style: bar transform + optional per-bar data engine + ticker modifier.
registerChartType({
    id: 'renko-like',
    label: 'Renko-like',
    barTransform: { full: (bars) => transformAll(bars), next: (bar) => transformOne(bar) },
});

// A custom canvas layer, painted every frame with the chart (its id = its data channel).
registerRendererLayer({
    id: 'renko-like',
    placement: 'above-data',
    create: () => ({ mount(canvas) {/* keep it */}, render({ bars, data, coords, scale, bounds }) {/* paint */} }),
});

A registered chart type automatically appears in the workspace's style dropdown, and a chart type's dataEngine pushes to its layer's channel with zero extra wiring. See docs/contributing/plugin-sdk.md.

Documentation

Full documentation lives in docs/: user guides (quickstart, the workspace, options, API reference), architecture, and contributing guides including the plugin SDK.

Development

npm install
npm run playground   # vite playground on http://localhost:5190
npm test             # vitest
npm run build        # tsup → dist/

License and attribution

Vela™ is licensed under the Apache License, Version 2.0 (see LICENSE). The NOTICE file adds an attribution requirement, and redistributions must include it per Apache-2.0 §4(d):

This is the same licensing model used by other popular charting libraries, and we're grateful when the watermark stays in a visible spot.

No scripting engine ships with this package; the Pine Script® addon (@luxalgo/vela-pinets) is AGPL-3.0 and licensed separately (see Indicators).

Vela (LuxAlgo/Vela)

Searching Database…

1.2K ·GitHub
Vela
What is this?Vela is a free, open-source library for building fast financial charts in the browser, built around a headless core with a native WebGL2 renderer (canvas2d fallback) and a plugin SDK for swapping in custom data, scripting engines, and renderers.
Is this a library or a full chart app?It's modular: @luxalgo/vela is the headless chart core you drive from code, @luxalgo/vela/workspace is a ready-made full chart app (one call), @luxalgo/vela/ui is the component kit, and @luxalgo/vela/plugin is the extension SDK.
How do I add it to a project?Install the npm package and either call the workspace for a complete chart app in one line, or drive the headless core directly. A self-contained browser bundle (dist/vela.global.js) is also shipped for script-tag use without any build step.
Do I need a market-data provider to use it?Not necessarily — Vela ships ready-to-register providers for Binance, Coinbase, and Hyperliquid, but you can skip all of them and pass your own OHLC bars to run fully offline.
Does it support Pine Script out of the box?No — Vela ships with zero scripting engines. Pine Script support comes from the separate @luxalgo/vela-pinets addon, which is AGPL-3.0 (unlike Vela's own Apache-2.0 core) because it runs the AGPL-licensed PineTS runtime.
What's the catch with the Apache-2.0 license?Every chart shows a small VelaTM attribution watermark by default, and the NOTICE file requires you to only disable it if an equivalent visible 'VelaTM' link is shown elsewhere on the same page.
What indicators come built in?70+ built-in studies — moving averages, bands and channels, momentum oscillators, trend and volatility measures, volume studies, and overlays like VWAP, SuperTrend, and Pivot Points — each with a legend row, settings dialog, and persistence.
Can I add my own chart types or renderer layers?Yes, the plugin SDK lets you register custom chart types and canvas renderer layers without forking the project; a registered chart type automatically appears in the workspace's style dropdown.
What does the ready-made workspace app include?A full chart UI with a symbol/timeframe/style/indicator topbar, status line, bottom bar (ranges, clock, timezone), object tree, keyboard shortcuts, named cells, sync groups, and one persisted layout state, all set up in a single call.
Which data providers ship out of the box?Binance, Coinbase, and Hyperliquid providers are ready to register, or you can plug in your own data source.
What are similar projects?lightweight-charts, d3, G2, highcharts, vue-echarts, Chart.js, echarts, uPlot
Which topics is it in?charting, charting-library, chart, headless, stock-market, trading, canvas, webgl, finance, plugin-system, component-library, data-visualization
Creator
LuxAlgo
Size
6.5 MB
Stars
1.2K
Updated
CommitOct 13
Age
3mo
Commits · 90 Days