Lightweight Charts — скиллы для агентов
Lightweight Charts skills
Два скилла TradingView: работа с графиками Lightweight Charts v5 без устаревших вызовов v4 и написание собственных плагинов, серий и примитивов
- 17 715 ★ репозитория
- Последний коммит
- Apache-2.0
Минимальный доступ
Почему такой уровень
- Скиллы только меняют инструкции агента, а код графика он пишет и правит в вашем проекте
- Скилл для плагинов предлагает скачивать исходники с raw.githubusercontent.com и клонировать репозиторий библиотеки во временную папку
Установка
- Работает в
В терминале, через SkillFoxx CLI
npx skillfoxx add skills/lightweight-charts-skillsОпределит агенты на машине, покажет уровень доступа и зафиксирует версию.
Другие способы установки
Доступ и проверки
Как мы проверяемМинимальный доступИнструмент ничего не запускает и не ходит в сеть.
- Скиллы только меняют инструкции агента, а код графика он пишет и правит в вашем проекте
- Скилл для плагинов предлагает скачивать исходники с raw.githubusercontent.com и клонировать репозиторий библиотеки во временную папку
Это чужой код. Посмотрите файлы в репозитории перед установкой.
Что делает
В репозитории Lightweight Charts, библиотеки финансовых графиков TradingView на HTML5 canvas, лежат два скилла в папке `.github/skills`. Скилл `lightweight-charts` помогает работать с самой библиотекой: создать график, добавить серии (линия, область, столбики, свечи, гистограмма), настроить шкалы времени и цены, подключить данные в реальном времени, панели, маркеры, подсказки и обертки для React, Vue и веб-компонентов. Сначала он проверяет версию и типы установленного пакета в `node_modules/lightweight-charts/dist/typings.d.ts` и только потом отвечает, а если файла нет, сообщает, что проверить не удалось. Названия методов и параметров он сверяет с типами и не придумывает свои. Главный прием скилла — таблица замены кода версии 4 на версию 5. Вместо `addLineSeries` и `addCandlestickSeries` агент вызывает `chart.addSeries` с типом серии, вместо `series.setMarkers` использует `createSeriesMarkers`, вместо параметра `watermark` — `createTextWatermark`. Время в `UTCTimestamp` он задает в секундах, а не в миллисекундах. Если пользователь импортирует `lightweight_charts` с подчеркиванием, скилл предупреждает, что речь о стороннем Python-пакете, и не дает ему советов для JavaScript. Второй скилл, `lightweight-charts-plugin-authoring`, нужен тем, кто пишет плагины. Он помогает выбрать тип расширения (собственная серия, примитив серии или панели), предлагает создать заготовку командой `npm create lwc-plugin@latest`, строить код на пакете `@tradingview/lwc-toolkit` и брать за образец официальные плагины. Отдельный перечень ловушек касается автомасштаба, пропусков данных, видимого диапазона и проверки попадания курсора.
Для кого. Для фронтенд-разработчиков, которые встраивают биржевые и другие временные графики на Lightweight Charts, и для авторов плагинов к этой библиотеке.
Подходит, если
- Агент пишет код графика по старым примерам и вызывает `addLineSeries`, а проект работает на версии 5
- Нужны свечной график с объемом на отдельной панели, маркеры сделок или подсказка у курсора
- Данные приходят потоком, и нужно обновлять последнюю свечу, а не перезаписывать весь ряд
- Нужен собственный тип серии или отметка на графике, например полосы, стопки столбцов или инструмент рисования
- Библиотеку подключают в React, Vue или веб-компонент, и нужно правильно разобраться с жизненным циклом
Не подходит, если
- Нужны сложные аналитические графики, карты и диаграммы связей: библиотека рисует финансовые и временные ряды, для общих задач в каталоге есть MCP-сервер графиков от AntV
- Проект на Python: скилл сразу отсылает к стороннему пакету `lightweight_charts` и не помогает с его кодом
- Версия библиотеки ниже 5 и обновляться не собираетесь: скилл ведет к API версии 5 и не смешивает его с синтаксисом версии 4
- Нужны готовые рыночные данные и индикаторы: библиотека только рисует график, а источник данных вы подключаете сами
Пример запроса к агенту
Построй свечной график на Lightweight Charts v5 с гистограммой объема на отдельной панели и обновлением последней свечи из веб-сокетаОграничения
- Скиллы написаны под версию 5 библиотеки. Для кода версии 4 и старше агент заменяет вызовы по таблице, а не сохраняет их.
- Скилл `lightweight-charts` опирается на локальные типы пакета. Без установленного `lightweight-charts` или файла `typings.d.ts` агент сообщает, что проверить имена методов нельзя.
- Подсказка о хит-тесте у пользовательской серии работает только на версии 5.2 и новее.
- Скилл для плагинов предлагает читать исходники образцов из GitHub по сети и, при желании, клонировать репозиторий библиотеки командой `git clone --depth 1`. Мастер `create-lwc-plugin` интерактивный: он задает вопросы о типе, имени, пакете и лицензии, и его удобнее запускать самому.
- Лицензия Apache-2.0.
Как отключить. Удалите папки `lightweight-charts` и `lightweight-charts-plugin-authoring` из каталога скиллов вашего агента. Сама библиотека `lightweight-charts` и код графиков в проекте останутся, их убирает `npm uninstall lightweight-charts`.
Частые вопросы
Как установить скиллы Lightweight Charts в Claude Code или Codex?
Выполните `npx skills add tradingview/lightweight-charts`. Чтобы взять один из двух, добавьте `--skill lightweight-charts` или `--skill lightweight-charts-plugin-authoring`. В README авторы называют Claude Code и Codex, а оба скилла рассчитаны на совместную установку.
Чем версия 5 отличается от версии 4 в коде графика?
Серии теперь создает один метод `chart.addSeries` с импортируемым типом серии вместо `addLineSeries` и `addCandlestickSeries`. Маркеры задаются через `createSeriesMarkers`, водяные знаки через `createTextWatermark` и `createImageWatermark`, а типы серий подключаются явным импортом, что позволяет выкидывать неиспользуемые.
Почему график пустой или ломается при потоковых данных?
Частая причина: время передано в миллисекундах, а `UTCTimestamp` ждет секунды, или времена повторяются, или идут не по возрастанию. Для потока скилл советует `series.update(point)` для последней точки и не вызывать `setData` на каждый тик.
Как выбрать между собственной серией и примитивом?
Скилл по умолчанию советует примитив. Собственная серия нужна, когда идея сама по себе серия со своими данными, автомасштабом и меткой последней цены. Украшение одной серии делают примитивом серии, украшение панели, например водяной знак или легенду, примитивом панели.
Что скилл говорит про часовые пояса?
Свойства `timezone` в шкале времени он не использует. Для подписей скилл рекомендует форматтеры на `Intl.DateTimeFormat`, а сами данные задаются в UTCTimestamp.
Обсуждение
Вопросов и отзывов пока нет.
Похожие
СкиллыThree.js Awesome Graphics Skills
threejs-awesome-graphics-agent-skills
Пакет скиллов three.js для красивой графики сцен и игр: свет, PBR, шейдеры, TSL и WebGPU, постобработка, частицы
Скиллы Preline UI для агентов: сборка интерфейсов из компонентов Tailwind CSS и генерация тем по токенам
Скилл и MCP-сервер библиотеки Shaders: агент собирает фоны, стекло, градиенты и курсорные эффекты на WebGPU для React, Vue, Svelte, Solid и JS
Web Animation Skills
web-animation-skills
Скиллы веб-анимации: GSAP, SVG, Lottie, микровзаимодействия, переходы между страницами, 60 кадров в секунду. Установка npx skills или плагином
Скилл рисует макеты интерфейсов и лендингов и переносит их в HTML, в проект на React или в мини-приложение WeChat
shadcn-vue — скилл для агентов
shadcn-vue skill
Скилл shadcn-vue читает настройки вашего проекта и учит агента добавлять компоненты, формы и темы Vue-порта shadcn/ui по правилам библиотеки
Сравнение с похожими
Записи с тем же главным запросом: чем они отличаются.
| Запись | Официальный | Авторизация | Звезды репозитория | Главное отличие |
|---|---|---|---|---|
| Lightweight Charts — скиллы для агентов (эта запись) | да | 17 715 | ||
| MCP Server Chart | да | не нужна | 4 408 | MCP-сервер AntV генерирует графики и диаграммы 25 с лишним типов, от линий до карт |
| AntV Chart Visualization Skills | нет | 516 | скиллы AntV для подбора типа графика и построения |
Коротко о README
Описание библиотеки содержит таблицу файлов сборки (модульные и автономные, для разработки и production), пример подключения и раздел об ИИ-помощниках с командой установки двух скиллов. Скилл по работе с библиотекой содержит модель из восьми слоев, таблицу задач с рекомендуемыми вызовами и список источников в документации. Скилл для плагинов дополнен тремя справочниками: официальные плагины, контракт пакета и инструментарий.
Бейдж для README
Исходный SKILL.md
--- name: lightweight-charts description: >- Use when working with TradingView's lightweight-charts — creating charts, adding series (Line/Area/Bar/Candlestick/Histogram), configuring time and price scales, streaming realtime or historical data, panes, markers, per-bar/per-point colors, tooltips, coordinate conversion, custom plugins or primitives, non-financial horizontal scales, SSR/browser loading, or React/Vue/Web Components wrappers. Covers v5 API conventions and the common time, scale, marker, plugin, and wrapper foot-guns. --- # Lightweight Charts skill Works the same whether the project is a downstream npm consumer app or an upstream `lightweight-charts` source checkout. Detect which one you are in (below) and resolve every API name from whatever typings are locally available. ## Source lookup order Do not assume you are inside the upstream source repository. 1. In a consumer app, inspect the installed package first: - `node_modules/lightweight-charts/package.json` for the actual version. - `node_modules/lightweight-charts/dist/typings.d.ts` for the API surface.