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