syncfusion-react-circular-gauge — скилл Claude Code: установка
Скилл помогает собрать круговой индикатор на React для KPI, датчиков, спидометров и мониторинга в реальном времени.
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-circular-gauge -a claude-codeЧто делает syncfusion-react-circular-gauge
Скилл подсказывает, как реализовать Syncfusion React Circular Gauge для отображения значений на круговой шкале. Он охватывает оси, указатели Needle, RangeBar и Marker, цветовые диапазоны, аннотации, легенду, анимацию, интерактивность и обновление данных в реальном времени. Также описаны печать и экспорт в PDF, PNG и SVG.
Внутри есть отдельные материалы по установке, структуре шкалы, размерам, внешнему виду, API, доступности и локализации. Скилл рассчитан на проекты с React и пакетом @syncfusion/ej2-react-circulargauge: без этого пакета компонент кругового индикатора не собрать.
Какие задачи решает
- показать KPI на круговой шкале
- собрать спидометр или индикатор температуры
- отобразить несколько значений на одной оси
- обновлять указатель по данным датчика
- экспортировать шкалу в PDF, PNG или SVG
Примеры запросов агенту
- Собери на React круговой спидометр с диапазонами и указателем Needle.
- Добавь в дашборд несколько указателей для сравнения KPI и обновляй их по данным в реальном времени.
- Настрой для
CircularGaugeComponentпечать и экспорт в PDF, а также подписи для экранного диктора.
Как установить syncfusion-react-circular-gauge
1Через Skills CLI (Vercel)
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-circular-gauge -a claude-code2Вручную: положить файлы
~/.claude/skills/syncfusion-react-circular-gauge/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/syncfusion-react-circular-gauge/
1Через Skills CLI (Vercel)
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-circular-gauge -a codex2Вручную: положить файлы
.agents/skills/syncfusion-react-circular-gauge/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-circular-gauge -a cursor2Вручную: положить файлы
.cursor/skills/syncfusion-react-circular-gauge/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install syncfusion/react-ui-components-skills syncfusion-react-circular-gauge2Вручную: положить файлы
.github/skills/syncfusion-react-circular-gauge/SKILL.md1Через Skills CLI (Vercel)
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-circular-gauge -a gemini-cli2Командой платформы
gemini skills install https://github.com/syncfusion/react-ui-components-skills --path skills/syncfusion-react-circular-gaugeВручную: положить файлы
.devin/skills/syncfusion-react-circular-gauge/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-circular-gauge -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о syncfusion-react-circular-gauge
Как установить syncfusion-react-circular-gauge в Claude Code?
Выполните npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-circular-gauge -a claude-code, затем откройте ~/.claude/skills/syncfusion-react-circular-gauge/SKILL.md.
Что делает syncfusion-react-circular-gauge?
Скилл помогает создавать круговые шкалы для KPI, сенсорных показаний, процентов и спидометров. Он описывает оси, указатели, диапазоны, аннотации, экспорт и доступность.
Какая библиотека нужна для работы кругового индикатора?
В React-проект нужно установить пакет @syncfusion/ej2-react-circulargauge. Без него компонент не соберётся.
