前言¶
做教育类产品的开发者通常会遇到一类重复需求：生成字帖、练习纸、可打印的学习用纸。网格类型多——米字格、田字格、回宫格、九宫格、四线三格……每一种的辅助线规则都不同；而前端要同时照顾浏览器和微信小程序两端，Canvas API 写法还有差异。自己逐个实现一遍，成本高且容易画错辅助线。下面介绍的通用网格排版引擎，就是专门处理这件事的 Skill。
这是什么¶
通用网格排版引擎（米字格/田字格等13种），坐标 @user_3ff3c268/canvas-grid-engine，由社区开发者 user_3ff3c268 发布并维护，当前版本 1.2.0，来源为 community，SkillHub 分类为 education。
它解决的问题是：在 Canvas 2D 上按统一接口生成 13 种教育用纸/字帖网格，并附带汉字排版规则（居中、自动换行、拼音标注）和一套微信绿配色设计令牌。定位是纯前端、零依赖，浏览器与微信小程序的 Canvas API 完全一致，不需要服务端参与。
核心功能¶
1、网格类型：米字格、田字格、回宫格、九宫格、方格、横线、四线三格、点阵格、黄金圆格、米字回宫格、田字四点格、无格等，共 13 种。
2、汉字排版：汉字在格内居中、按行自动换行、可输出拼音标注，满足字帖场景的基本排版要求。
3、设计令牌：内置微信绿（#07C160）配色令牌，输出风格与微信生态一致。
4、运行环境：纯前端零依赖，直接使用宿主环境的 Canvas 2D 能力，浏览器与微信小程序两端 API 一致。
5、触发词：生成字帖 / 练习纸 / 米字格 / 田字格 / 网格渲染 / 学习用纸 / 可打印纸 / 拼音标注。在 Agent 中调用时，用这些自然语言表达即可命中。
根据 SkillHub 页面数据（抓取时间 2026-11-05），该 Skill 评分 100000，下载 837 次，标签显示 requires_api_key=false，即不需要 API Key。
安装与启用¶
官方地址：https://api.skillhub.cn/user_3ff3c268/canvas-grid-engine ，SkillHub 页面：https://www.skillhub.cn/skills/user_3ff3c268/canvas-grid-engine 。
启用方式为把该 Skill 安装到支持 SKILL.md 格式的 Agent 环境（如 Cursor、Codex CLI、Claude Code 等）后，在对话中使用上述触发词调用。本次写作时官方页面抓取失败，未能核实到具体的安装命令、目录路径或配置文件字段，因此不在此给出未经核实的命令；如需命令级文档，建议直接打开官方地址查看。
典型用法¶
官方资料未提供逐行的代码示例，下面给出可复现的调用流程。
1、在浏览器或微信小程序页面中准备好一个 Canvas 2D 上下文（两端写法一致）。
2、在 Agent 对话中使用触发词提出需求，例如“生成米字格练习纸，带拼音标注”或“画一张四线三格的可打印纸”。
3、Agent 命中该 Skill 后，会在 Canvas 2D 上绘制对应网格，汉字按居中与自动换行规则排布，需要时附加拼音标注。
4、如需改配色，要求使用微信绿设计令牌或直接指定颜色值。
网格类型覆盖：米字格、田字格、回宫格、九宫格、方格、横线、四线三格、点阵格、黄金圆格、米字回宫格、田字四点格、无格。
适用场景与注意¶
适合谁：教育类 Web 应用、微信小程序里需要字帖/练习纸功能的开发者；也适合需要在服务端或离线环境用 Canvas 2D 批量产出可打印学习用纸的场景（无外部依赖，不涉及 API Key）。
限制与坑：
1、该 Skill 只负责网格绘制与汉字排版规则，不包含字体文件、打印样式（页边距、纸张尺寸）的完整处理，打印前的版式需自行把关。
2、拼音标注依赖宿主环境的拼音数据或输入，官方资料未说明拼音词库来源，对生僻字或多音字的标注结果需要实际验证。
3、“浏览器与微信小程序 Canvas API 完全一致”是指调用层一致，但不同端对 canvas 节点获取方式（如 document.getElementById 与 wx.createSelectorQuery）不同，接入时仍需按端处理。
4、本次写作时官方页面无法抓取，版本号（1.2.0）、评分与下载量以 SkillHub 预抓取数据为准，安装前建议到官方页面复核一次。
结尾¶
通用网格排版引擎把 13 种教育用纸网格、汉字居中与换行、拼音标注、微信绿配色集中在一个零依赖的前端 Skill 里，两端 API 一致，适合直接嵌入教育产品的字帖与练习纸功能。官方地址：https://api.skillhub.cn/user_3ff3c268/canvas-grid-engine 。
