К основному содержанию
affpapa.org
RU EN
скилл CX Codex

syncfusion-react-accumulation-chart — скилл для Claude Code

Скилл помогает собирать React-графики Pie, Doughnut, Funnel и Pyramid. Нужен для процентных, пропорциональных и иерархических данных.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓ 
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-accumulation-chart -a claude-code
Открыть на GitHub

Что делает syncfusion-react-accumulation-chart

Скилл описывает работу с AccumulationChartComponent из Syncfusion React Charts. Он помогает агенту настроить четыре типа графиков: круговой Pie, кольцевой Doughnut, воронку Funnel и пирамиду Pyramid. В сценарии входят привязка данных, подписи, легенды, подсказки, группировка малых значений и умные подписи без наложений.

Также разбираются drill-down, эффекты выделения сегментов, полу круговые диаграммы, темы, цвета, шаблоны, аннотации и экспорт с печатью. Для проекта нужен пакет @syncfusion/ej2-react-charts; без него примеры с AccumulationChartComponent не собрать. Подходящие настройки зависят от типа визуализации и структуры данных.

Какие задачи решает

  • собрать круговую диаграмму по пропорциям
  • показать процентные данные в Doughnut
  • визуализировать этапы воронки продаж
  • сгруппировать малые значения на графике
  • добавить подписи и подсказки к сегментам

Примеры запросов агенту

  • Собери в React Pie-график из данных продаж с подписями, легендой и подсказками.
  • Настрой AccumulationChartComponent для Doughnut с группировкой малых значений и эффектом выделения выбранного сегмента.
  • Добавь Funnel-график с умными подписями и drill-down по клику на элемент.

Как установить syncfusion-react-accumulation-chart

1Через Skills CLI (Vercel)

npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-accumulation-chart -a claude-code

2Вручную: положить файлы

~/.claude/skills/syncfusion-react-accumulation-chart/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/syncfusion-react-accumulation-chart/

По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов

Вопросы о syncfusion-react-accumulation-chart

Как установить syncfusion-react-accumulation-chart в Claude Code?

Выполните npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-accumulation-chart -a claude-code, затем используйте файл ~/.claude/skills/syncfusion-react-accumulation-chart/SKILL.md.

Что делает syncfusion-react-accumulation-chart?

Скилл помогает реализовать в React графики Pie, Doughnut, Funnel и Pyramid, а также настроить подписи, легенды, подсказки, группировку и drill-down.

Какой пакет нужен для работы с этим скиллом?

В проекте используется пакет @syncfusion/ej2-react-charts.

Похожие скиллы

Всё по теме «Фронтенд и UI» →
frontend-design официальный anthropics Скилл задаёт осмысленное визуальное направление для новых интерфейсов и редизайна. Подойдёт, когда стандартный шаблонный UI не устраивает. 1 025 790установок design-taste-frontend Leonxlnx Скилл задаёт арт-дирекцию для публичных страниц и рабочих экранов, а затем проверяет результат в браузере по скриншотам. Нужен, когда интерфейс выглядит шаблонным или недоработанным. CX Codex +1 678 700установок prototype Matt Pocock Создаёт временный прототип, чтобы проверить логику, модель состояния или вид интерфейса до работы над основным кодом. 986 201установок hyperframes heygen-com Скилл задаёт агенту правила рендера HTML-кода в видео через HyperFrames. Помогает собирать проморолики, эксплейнеры и титры прямо в коде проекта. CX Codex +1 1 200 000установок hyperframes-cli heygen-com Управляет проектами HyperFrames через терминал: собирает таймлайн, проверяет контраст кадров, запускает предпросмотр и рендерит видео локально или в облаке. CX Codex +1 1 300 000установок webapp-testing официальный anthropics Скилл запускает проверки локальных веб-приложений через Playwright: помогает отлаживать UI, делать скриншоты и смотреть логи браузера. 186 758установок

Из того же набора37

syncfusion-react-license Разбирает лицензирование Syncfusion в React-проектах: генерация ключа, регистрация, ошибки валидации. Пригодится, когда сборка сыплет предупреждениями о лицензии. CX Codex +1 718установок syncfusion-react-image-editor Скилл для работы с компонентом Syncfusion React Image Editor: подскажет агенту, как встроить редактирование картинок в React-приложение. CX Codex +1 718установок syncfusion-react-chat-ui Скилл помогает собирать чат-интерфейсы на React с сообщениями, вложениями, индикаторами набора и настройкой внешнего вида. CX Codex +1 715установок syncfusion-react-tabs Помогает агенту собрать и настроить компонент Tab из Syncfusion для React: заголовки, перетаскивание, ленивую загрузку контента. CX Codex +1 715установок syncfusion-react-barcode Скилл для генерации штрихкодов, QR-кодов и Data Matrix в React через компоненты Syncfusion. Пригодится, когда нужно встроить коды в форму, отчёт или этикетку. CX Codex +1 711установок syncfusion-react-pivot-table Скилл помогает собирать и настраивать PivotView в React: данные, группировку, фильтры, агрегации, экспорт и pivot charts. CX Codex +1 709установок syncfusion-react-dashboard-layout Скилл для ИИ-агента: подсказывает, как собрать дашборд на React с перетаскиваемыми панелями Syncfusion. CX Codex +1 709установок syncfusion-react-maps Помогает агенту собрать географическую карту на React: GeoJSON, маркеры, пузыри, легенда, хороплет. Пригодится, когда данные нужно показать по регионам. CX Codex +1 707установок

Спонсоры проекта

Компании, которые помогают держать аналитику открытой
Золотой спонсор AI-аналитика спроса на iGaming — индекс, тренды, конкуренты
Nutra.Club Закрытое сообщество Nutra-вертикали от команды M1

Показы, клики и копирования кода — открытая статистика. Мы держим цифры публичными по той же логике, что и сам NeBlask. Стать спонсором