canvas 绘制圆角多边形需手动构造路径，核心是用 arcto 在每个顶点处以半径 r 生成内切圆弧实现光滑过渡；对边长不足 2r 的情况须动态缩放半径；支持独立角半径时需改用 arc 并手动计算切点与圆心。
Canvas 本身不提供直接绘制圆角多边形的 API，必须通过路径（beginPath → moveTo/lineTo/arcTo/arc → closePath）手动构造。核心在于：在每个顶点处用圆弧替代尖角，同时保证相邻边自然过渡——这需要精确计算切点与弧参数，而非简单套用矩形逻辑。
关键原理：用 arcTo 实现顶点圆角
对顺时针排列的顶点数组 [A, B, C, ...]，在顶点 B 处生成圆角，本质是画一段以 B 为“夹角顶点”、半径为 r 的内切圆弧。`arcTo(x1,y1,x2,y2,r)` 正是为此设计：
它从当前点出发，先向 (x1,y1) 方向画直线，再以半径 r 弯向 (x2,y2)，自动连接成光滑过渡。
实际调用时，设前一顶点为 P0，当前顶点为 P1，下一顶点为 P2，则：
→ 先 lineTo(P1) 到达角点；
→ 再 arcTo(P1.x, P1.y, P2.x, P2.y, r) 向下一条边过渡。
四步路径构造法（推荐）
适用于任意凸/简单凹多边形（顶点按顺时针或逆时针顺序）：
- 从首尾连线中点开始
moveTo，避免起点悬空 - 遍历每个顶点
i，执行lineTo(顶点[i]) - 对每个顶点
i，调用arcTo(顶点[i].x, 顶点[i].y, 顶点[(i+1)%n].x, 顶点[(i+1)%n].y, r) - 最后
closePath()封闭路径（注意：arcTo 已隐含连接，无需额外 lineTo）
半径容错与边界处理
当某条边长小于两倍圆角半径时，直接使用原值会导致弧超出边界或自交。正确做法是按边长动态缩放：
- 对顶点
B，计算前边AB和后边BC的长度len1、len2 - 该角可用最大半径为
min(r, len1/2, len2/2)（更严谨可取min(r, len1, len2) * 0.5） - 若需保留原始半径配置（如 UI 编辑器），可在数据层记录原始值，渲染时仅做视觉裁剪
支持独立角半径的增强实现
若每个顶点需不同半径（如左上角 4px、右下角 12px），不能只传单个 r，而应传入数组 [r0, r1, ..., rn-1]。此时需改用 arc() 手动算切点：
- 对顶点
P1，求向量v0 = P1→P0与v1 = P1→P2的单位法向量 - 沿两邻边方向各偏移
r_i，得到圆弧起点S和终点E - 圆心
O是两条偏移线的交点，再用arc(O.x, O.y, r_i, startAngle, endAngle)绘制
该方式计算量略大，但完全可控，适合高精度图形工具。
