JavaScript Charting Libraries for Finance

What draws the candles inside a product you ship — a finished renderer or a toolkit to assemble, how many bars it survives, and what the licence costs.

Last updated

For a product you sell, the honest default is free: Lightweight Charts if you want candles, panes and a crosshair already wired, Apache ECharts if the chart is one of many in a dashboard. Pay for Highcharts Stock when you want range selectors, data grouping and a support contract. The first real question is not price but whether you are buying a finished financial chart or a toolkit to assemble one from — that gap is an order of magnitude of work.

Where the data behind the chart is stored is a separate shopping trip with no shared vendor or price model, and it lives in tick data storage.

A chart, or a charting toolkit

Decide first which of the two you are buying, because the gap between them is most of the project.

A charting toolkit — ECharts, Plotly.js, Highcharts — gives you a candlestick series type, and everything a trading interface needs around it is yours to assemble: indicator panes, crosshair synchronisation between panes, drawing tools, symbol and timeframe switching, session breaks, the right-hand price scale.

A dedicated financial renderer like Lightweight Charts ships the panes, the crosshair and the price scale already wired, and leaves out the indicator library and the drawing tools entirely. The full trading UI, drawing tools and all, is a separate product with its own agreement.

How it draws decides how many bars it survives

Canvas and WebGL renderers scale with pixels; SVG renderers create a DOM node per point and fall over somewhere around ten thousand elements.

Plotly.js draws candlesticks in SVG and has no WebGL candlestick trace — its scattergl acceleration does not apply — so a couple of months of five-minute bars is already sluggish. Highcharts' Boost module is WebGL but its accelerated series list does not include candlestick either; Highcharts Stock's answer to a million points is data grouping, aggregating bars until they are wide enough to see, plus loading the rest from the server on demand. That is a good answer, and it is a different answer from "it is fast".

Bundle size is a cost your users pay

Plotly.js is the outlier: over 2 MB minified for the full build, and even its trimmed basic bundle is around 277 KB minified and gzipped, which is more than an entire dedicated chart library. Lightweight Charts is roughly an order of magnitude smaller than that basic bundle. If the chart is the whole page, this matters less than it looks; if it is one widget on a marketing site, it is the decision.

Check the financial furniture individually

"Supports candlestick charts" is the cheapest claim in this market. Volume in a linked pane, a crosshair that moves across panes together, indicator overlays on the price scale rather than a second axis, drawing tools that persist, and non-linear time so that weekends and overnight gaps do not open holes in the series: each is either built in or homework, and general-purpose libraries default to the linear time axis that puts a two-day gap in every equity chart.

The licence words, and what each one actually permits

This is the part that decides whether you may ship what you built. Read the LICENSE file of the version you pin, not the badge in the README.

OSI open source — MIT or Apache-2.0, no conditions on what you build or sell. Apache ECharts and Plotly.js.

Apache-2.0 with an attribution you must display. Lightweight Charts is a real Apache-2.0 licence, plus a NOTICE requiring the attribution notice and a link back to TradingView on any page or app that shows the charts — satisfied either by your own credit line or by the built-in attribution logo option on the chart. Turning that option off without putting the credit somewhere else is a licence breach, not a styling choice.

Free for non-commercial use, per-developer otherwise. Highcharts sells seats: 366 dollars per developer per year for Core and another 366 for Stock, with perpetual licences also available, and every developer who touches the code needs one. Its free personal and education terms are narrower than the phrase suggests — personal enjoyment, self-education and classroom work — and the current version explicitly excludes professional, freelance and side-project use.

Free, but not open, and conditional. TradingView's Advanced Charts library is the full trading interface at no cost under its own agreement, and the conditions are real: licences go to companies rather than individuals, the project must be publicly accessible rather than internal or behind a paywall, and the attribution link must stay, without nofollow or sponsored on it. There is no OSI licence anywhere in that arrangement.

What it costs

Per-developer seats on the commercial libraries, and nothing at all on the rest. There is no affiliate money anywhere in this category, which is roughly why nobody had written the comparison.

All 9 tools in Charting Libraries

Compiled from each vendor’s own documentation, pricing page and terms — no card here is marked hands-on yet.

Showing 9 of 9

How to

One task each, the cards that do it, and what breaks on the obvious attempt.

FAQ

What is the cheapest way to put a candlestick chart in a commercial product?

Free, and legitimately so — Lightweight Charts under Apache-2.0 provided you keep its attribution link, Apache ECharts, or Plotly.js under MIT. The paid path is Highcharts Stock at 366 dollars per developer per year on top of 366 for Highcharts Core. What is never free for a product you sell is a library advertised as free for non-commercial use.

Which JavaScript charting library handles the most bars?

The renderer decides it. Canvas and WebGL libraries scale with pixels; SVG libraries create a DOM node per point and struggle somewhere around ten thousand elements. Plotly.js draws candlesticks in SVG with no WebGL fallback for that trace type, so a couple of months of five-minute bars is already sluggish. Highcharts Stock's answer to a million points is data grouping plus server-side loading, which is a good answer and a different one from raw speed.

Do I need a charting library or a charting toolkit?

A dedicated financial renderer such as Lightweight Charts ships the panes, the crosshair and the price scale already wired, and leaves out the indicator library and drawing tools. A general toolkit — ECharts, Plotly.js, Highcharts — gives you a candlestick series type and leaves the whole trading interface around it for you to build. The gap between the two is an order of magnitude of work.

Is TradingView's charting library free to use commercially?

Two different products, two different answers. Lightweight Charts is genuinely Apache-2.0, with a NOTICE requiring a visible attribution link back to TradingView. Advanced Charts — the full trading interface with drawing tools — costs nothing but is not open source. Licences go to companies rather than individuals, the project must be publicly accessible rather than internal or paywalled, and the attribution link must stay without nofollow or sponsored on it.

Does bundle size matter for a chart library?

It depends where the chart sits. Plotly.js is the outlier at over 2 MB minified for the full build, and around 277 KB minified and gzipped even for its trimmed basic bundle — more than an entire dedicated chart library. If the chart is the whole page that matters less than it looks; if it is one widget on a marketing page, it is the decision.