首页 文章

SVG Path，这是一个Cubic Bezier曲线吗？

提问于
浏览 次
1

This is a two-part question:

  • 下面的第一个代码部分（由Adobe Illustrator生成）是否代表SVG文件中的Cubic Bezier曲线？

  • 如果是这样，小写Cs后面的每个数字在第一个（Adobe Illustrator）示例中代表什么？

Adobe Illustrator Example:

<path style =“fill：none; stroke：＃00FF00; stroke-width：0.5102; stroke-linecap：round; stroke-linejoin：round;” d =“M223.827,404.942 c-6.741,6.32-7.083,16.908-0.762,23.649l0,0c0.184,0.201,0.561,0.577,0.762,0.762”/>

以下是 w3: 的一个例子的一部分

<path class="SamplePath" d="M100,200 C100,100 250,100 250,200
                                       S400,300 400,200" />

在第二个W3示例中，我理解'M'之后的数字是指起始x，y坐标，而大写'C'指示绝对定位 . 在关于XY分组的W3示例中，该模式似乎相当明显 . 但是，我不知道如何制作Adobe Illustrator示例，其中的组由负号分隔而不是逗号，例如： 16.908-0.762 . How are the numbered sequences that follow the lower-case Cs in the Adobe Illustrator example parsed and grouped, and what do each of those numbers represent in the first (Adobe Illustrator) example?

svg

1 回答

  • 3

    1的答案是肯定的 .

    至于2 ...

    在路径语法中，空格和逗号是可选的 . 16.908-0.762一次解析一个字符，因此解析器必须知道当它到达 - 符号时16.908是一个数字但16.908-不是，因此 - 符号必须是下一个数字的开头，即-0.762

    插图示例中有三对数字 . 添加可选空格使其更清晰......

    c -6.741,6.32 -7.083,16.908 -0.762,23.649

    语法是here

    回复于

相关问题