Canvas 原生不支持 textAlign = "full" 或文本两端对齐，需通过手动计算字间距或转向 HTML+CSS 渲染再转图来实现真正意义上的两端对齐效果。
canvas 原生不支持 `textalign = "full"` 或文本两端对齐，需通过手动计算字间距或转向 html+css 渲染再转图来实现真正意义上的两端对齐效果。
HTML5 的 2D 绘图上下文（CanvasRenderingContext2D）提供了 textAlign 属性，但其合法值仅限 "start"、"end"、"left"、"right" 和 "center" —— 官方规范中从未定义 "full" 或 "justify"。这意味着你无法像在 CSS 中设置 text-align: justify 那样，直接让 fillText() 自动拉伸单词间距以填满指定宽度。
✅ 正确理解限制：Canvas 是绘图 API，不是排版引擎
Canvas 将文本视为“路径绘制”或“位图填充”，不维护文字流、换行盒模型或软换行逻辑。因此，“两端对齐”这一依赖段落宽度、词间弹性间距和断行算法的排版行为，超出了 canvas 2D API 的设计范畴。
⚙️ 方案一：手动实现简易两端对齐（适用于单行）
若仅需单行文本在固定宽度内强制撑满（如标题），可结合 measureText() 动态计算并插入空格：
dom-to-image
- ❌ 不要尝试为 canvas 添加不存在的
textAlign = "full"； - ✅ 单行轻量场景 → 手动空格插值 +
measureText()； - ✅ 多行/生产环境/高保真需求 → 用 HTML+CSS 排版 +
dom-to-image导出，这是目前最健壮、可维护、跨浏览器一致的解决方案。
最终选择取决于你的精度要求与技术栈约束——但请始终记住：让对的事发生在对的层上。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
