lightweight-charts README

The project's README from github.com/tradingview/lightweight-charts. As one markdown file: README.md.

Lightweight Charts logo

Lightweight Charts™

CircleCI npm version npm bundle size Dependencies count Downloads pkg.pr.new

Demos | Documentation | Reddit

TradingView Lightweight Charts™ are one of the smallest and fastest financial HTML5 charts.

The Lightweight Charts™ library is the best choice for you if you want to display financial data as an interactive chart on your web page without affecting your web page loading speed and performance.

It is the best choice for you if you want to replace static image charts with interactive ones. The size of the library is close to static images but if you have dozens of image charts on a web page then using this library can make the size of your web page smaller.

Take a look at awesome-tradingview for related projects created by our community members.

The library provides a rich set of charting capabilities out of the box, but developers can also extend its functionality by building custom plugins. See the interactive plugin examples here, or check out plugin-examples/README.md for more details.

Installing

es6 via npm

npm install lightweight-charts

Latest master build

To try the latest master build without waiting for a release (powered by pkg.pr.new):

npm install https://pkg.pr.new/lightweight-charts@master

The import and usage below applies to both npm installation options:

import { createChart, LineSeries } from 'lightweight-charts';

const chart = createChart(document.body, { width: 400, height: 300 });
const lineSeries = chart.addSeries(LineSeries);
lineSeries.setData([
    { time: '2019-04-11', value: 80.01 },
    { time: '2019-04-12', value: 96.63 },
    { time: '2019-04-13', value: 76.64 },
    { time: '2019-04-14', value: 81.89 },
    { time: '2019-04-15', value: 74.43 },
    { time: '2019-04-16', value: 80.01 },
    { time: '2019-04-17', value: 96.63 },
    { time: '2019-04-18', value: 76.64 },
    { time: '2019-04-19', value: 81.89 },
    { time: '2019-04-20', value: 74.43 },
]);

CDN

You can use unpkg:

https://unpkg.com/lightweight-charts/dist/lightweight-charts.standalone.production.js

The standalone version creates window.LightweightCharts object with all exports from esm version:

const chart = LightweightCharts.createChart(document.body, { width: 400, height: 300 });
const lineSeries = chart.addSeries(LightweightCharts.LineSeries);
lineSeries.setData([
    { time: '2019-04-11', value: 80.01 },
    { time: '2019-04-12', value: 96.63 },
    { time: '2019-04-13', value: 76.64 },
    { time: '2019-04-14', value: 81.89 },
    { time: '2019-04-15', value: 74.43 },
    { time: '2019-04-16', value: 80.01 },
    { time: '2019-04-17', value: 96.63 },
    { time: '2019-04-18', value: 76.64 },
    { time: '2019-04-19', value: 81.89 },
    { time: '2019-04-20', value: 74.43 },
]);

Build Variants

Dependencies included Mode ES module IIFE (window.LightweightCharts)
No PROD lightweight-charts.production.mjs N/A
No DEV lightweight-charts.development.mjs N/A
Yes (standalone) PROD lightweight-charts.standalone.production.mjs lightweight-charts.standalone.production.js
Yes (standalone) DEV lightweight-charts.standalone.development.mjs lightweight-charts.standalone.development.js

AI coding assistants

This repository ships an Agent Skill that teaches AI coding assistants how to work with Lightweight Charts™ - the v5 API conventions, the mental model, and the common time, scale, marker, plugin, and wrapper foot-guns.

Install it into your project with the skills CLI:

npx skills add https://github.com/tradingview/lightweight-charts

This makes the skill available to compatible assistants (such as Claude Code, Codex, etc.), streamlining your workflow: they scaffold charts, wire up series and data, and answer API questions against the current v5 conventions out of the box - instead of relying on outdated snippets and stumbling into common foot-guns.

Development

See BUILDING.md for instructions on how to build lightweight-charts from source.

License

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this software except in compliance with the License. You may obtain a copy of the License at LICENSE file. Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

This software incorporates several parts of tslib (https://github.com/Microsoft/tslib, (c) Microsoft Corporation) that are covered by BSD Zero Clause License.

This license requires specifying TradingView as the product creator. You shall add the "attribution notice" from the NOTICE file and a link to https://www.tradingview.com/ to the page of your website or mobile application that is available to your users. As thanks for creating this product, we'd be grateful if you add it in a prominent place. You can use the attributionLogo chart option for displaying an appropriate link to https://www.tradingview.com/ on the chart itself, which will satisfy the link requirement.

lightweight-charts (tradingview/lightweight-charts)

Searching Database…

17.6K ·GitHub
Lightweight-charts
Что это такое?TradingView Lightweight Charts — это open-source библиотека очень компактных и быстрых финансовых графиков, которые рисуются через HTML5 canvas и позволяют показывать финансовые данные в виде интерактивного графика на веб-странице.
Это полноценная платформа TradingView или только часть с графиками?Только графики: это JavaScript/TypeScript-библиотека, которую вы встраиваете в свою веб-страницу, а не терминал TradingView и не хостинговый сервис. Также доступна автономная сборка для браузера.
Как добавить её на веб-страницу?Установите через npm (es6-импорт) или подключите автономную сборку с unpkg — она создаёт глобальный объект window.LightweightCharts. Поставляются production- и development-варианты, как со встроенными зависимостями, так и без них.
Лицензия Apache 2.0 правда бесплатна без всяких условий?Почти: вы обязаны указать авторство TradingView — добавить на страницу уведомление из файла NOTICE и ссылку на TradingView. Требование ссылки выполняет опция attributionLogo, которая рисует логотип прямо на графике.
Насколько библиотека really компактная?Её размер близок к графикам из статичных картинок, а страница с десятками таких картинок после перехода на эту библиотеку может даже стать меньше.
Можно ли настраивать графики шире встроенных возможностей?Да. Из коробки есть богатый набор функций для графиков, а разработчики могут расширять её собственными плагинами — в репозитории в папке plugin-examples лежат интерактивные примеры плагинов.
Для чего нужен поставляемый Agent Skill для AI-ассистентов?В репозитории есть скилл, который обучает AI-ассистентов вроде Claude Code и Codex соглашениям API v5 и типичным ошибкам при работе со временем, масштабом, маркерами, плагинами и обёртками — чтобы они создавали рабочие графики, а не копировали устаревшие сниппеты. Устанавливается через skills CLI.
Можно попробовать изменения, которых ещё нет в релизе?Да — свежие сборки master публикуются через pkg.pr.new, так что можно опробовать самую новую версию, не дожидаясь официального релиза.
What are similar projects?Chart.js, Vela, uPlot, d3, echarts, victory, plotly.js, bokeh
Which topics is it in?charting, charting-library, html5, trading, plugins, charts, canvas, finance, visualization, data-visualization, performance, npm
Creator
tradingview
Size
204 MB
Stars
17.6K
Updated
CommitOct 13Releasev5.2.1Aug 12
Age
7y
Commits · 90 Days