SuperAPI AI 工具集

pencil-ui-design-system-ucharts

设计与创作

查看项目

更新于 10-16 05:48

技能介绍

用途:在 .pen 文件中按 uCharts 规范初始化图表设计系统,设置图表主题色并创建各类图表的占位框架。仅在用户明确提到 Pencil 与 uCharts(或 qiun-data-charts),或编排 Pencil 设计系统初始化任务时使用。

主要能力:注册 uCharts 相关设计令牌,包括系列色 ucharts-color-1 至 ucharts-color-5(#1890ff、#52c41a、#faad14、#f5222d、#722ed1)、坐标轴/网格色 ucharts-axis-color(#e8e8e8)、文字色 ucharts-text-color(#666666)、字号 ucharts-font-size(12px);并创建 Charts Overview 框架,包含基础图表(折线、面积、柱状、条形、饼图、环形、雷达、散点)、组合与进阶(混合图、漏斗、K 线、热力图、仪表盘、词云)以及容器(图表容器占位、图例占位)等占位区块。

使用方式:该技能输出 PENCIL_PLAN,由 Agent 依次调用 Pencil MCP 工具:open_document、set_variables、batch_design,可选 get_screenshot。第一步用 mcp__pencil__set_variables 注册令牌,遵循 .pen 文件 schema;第二步用 mcp__pencil__batch_design 创建框架,使用 Auto Layout 组织,每次调用最多 25 个操作。

限制与注意:此处的图表组件仅为布局占位框架,实际图表配置在代码侧完成;令牌值需对照 uCharts 主题文档核验;set_variables 默认 replace: false,除非要求完全重置。更多令牌可参考 uCharts 主题文档。参考资料包括 references/contract.md、official.md、examples.md、components.md。