Elysia Tools
导航
Design
逐条命令行走 SVG 路径（M/L/H/V/C/S/Q/T/A/Z）——每段弧长、累计 stroke-dashoffset 距离、子路径包围盒、三次曲线控制柄矢量、圆弧 flag 求解、路径与 viewBox 对齐检查。
详情
粘贴任意 SVG
执行
填写表单、运行工具，并在同一页面查看结果。
案例
相关内容
工具使用指南
SVG 路径数据弧长行走器用于逐段解析 SVG 的 d 属性命令（包括 M、L、H、V、C、S、Q、T、A、Z）。工具支持相对坐标转绝对坐标、自适应辛普森求积计算精确弧长、解析导数极值获取包围盒、还原 S/T 反射控制柄并求解椭圆弧参数，同时提供基于命令边界的 stroke-dasharray/stroke-dashoffset 距离与 viewBox 对齐审计。
背景
正在开发一个路径描边加载动画，需要让动画在第一段曲线结束时暂停，随后再绘制第二段。
问题
需要获取平滑三次贝塞尔曲线（C 和 S）交界处的准确路径长度，以设置关键帧的 stroke-dashoffset。
如何使用
在路径数据输入框中粘贴包含 C 和 S 命令的字符串，设置 viewBox 为 0 0 200 200 并设置绘制比例为 50%。
pathData: "M 10 80 C 40 10, 65 10, 95 80 S 150 150, 180 80"
viewBox: "0 0 200 200"
drawPercent: 50结果
解析出两段曲线长度各为 141.0052，总长 282.0104，获得 C 命令边界的精确 dashoffset 值与 S 命令的反射手柄可视化。
背景
导出的 SVG 图标包含相对圆弧命令和闭合路径，在特定容器中渲染时存在未对齐的情况。
问题
需要确认 A 命令的圆心位置、旋转角度以及该形状是否完全处于指定 viewBox 内。
如何使用
输入包含相对命令与圆弧 flag 的 d 属性字符串，填入预期的 viewBox 尺寸 0 0 100 100 进行分析。
pathData: "M 100,100 h -50 a 50,50 0 1,1 50,-50 z"
viewBox: "0 0 100 100"
drawPercent: 75结果
计算出圆弧段长度 235.6194 与总长 335.6194，解析出圆心坐标为 (50, 50)，并确认图形与 0 0 100 100 边界完全对齐。
支持全部标准 SVG 路径命令，包括 M/m、L/l、H/h、V/v、C/c、S/s、Q/q、T/t、A/a、Z/z 及其隐式重复与紧凑写法。
直线段使用解析几何距离公式，贝塞尔曲线和椭圆弧采用相对容差 1e-9 的自适应辛普森求积法对速度积分进行精确求解。
不是。包围盒通过对贝塞尔曲线和椭圆弧的多项式导数求根计算解析极值，能够精准捕捉曲线的极值外接边界。
工具在命令表中列出每段的累计起点和终点距离，并提供原始用户单位及 pathLength="1" 归一化形式的 stroke-dasharray 和 stroke-dashoffset 属性片段。
审计会对比路径的实际包围盒与设定的 viewBox，检查是否存在溢出，并输出各向边距、居中偏移及建议的紧凑 viewBox 尺寸。