
Preview gallery
关于这个 Skill
电子表格数据网格是一种可立即粘贴的数据可视化,作为可编辑源及其使用示例提供。它配备了一个真实的数据网格,具有排序、分页和水平滚动以及访客驱动的滚动或步骤交互功能。颜色、类型和半径作为标记存在,您可以为整个块编辑一次。
About this Skill

您粘贴一个块,真实的数据可视化就会出现在页面上,该数据可视化是正确绘制的,而不是用 SVG 绘制的。输入你的数字,形状就会重新绘制。
What you get
- 电子表格数据网格的完整源代码 — 组件文件以及可运行的使用示例,可供粘贴和编辑。
- 书面视觉合同:调色板、字体比例、半径、图标笔画和运动计时,所有这些都作为您在一个地方编辑的标记。
- 表列和行作为纯数据;排序、分页和水平滚动都来自表格层。
如何使用
- 告诉您的助手该部分的位置,它首先读取您的项目,然后按照项目已编写的方式写入块。
- 用你的话替换这些词。字体大小和间距自行保留。
- 将行替换为您自己的数据 - 排序、分页和滚动继续工作。
- 发货前请在手机上查看。它已经被建造成可以容纳在那里。
What you need before you start
- Dependencies
- Ant Design——必填
- Last tested
- v1.0.3 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
What you get
- 电子表格数据网格的完整源代码 — 组件文件以及可运行的使用示例,可供粘贴和编辑。
- 书面视觉合同:调色板、字体比例、半径、图标笔画和运动计时,所有这些都作为您在一个地方编辑的标记。
- 表列和行作为纯数据;排序、分页和水平滚动都来自表格层。
Good fit
- 您需要在页面上进行数据可视化,但不想连接图表库。
- 您希望图表调色板和间距与页面的其余部分相匹配。
- 您需要可以编辑的可读源,而不是另一个需要不断升级的依赖项。
Not for
- 团队已经在运行成熟的设计系统——这个调色板和字体比例将与你的相抗衡。
- 任何想要版本化 npm 包的人;这会给你提供维持自己的资源。
- 需要实时流数据或在非常大的集合上虚拟滚动的图表。
Client & Executive Reporting研究与技术交流网页设计和数字体验创建信息图创建 UI 视觉效果建立网站页面Editable Output视觉上抛光适合初学者暖中性青色口音数据密集
User reviews
Loading reviews…






