SVG路径,这是一条三次贝塞尔曲线吗



这是一个由两部分组成的问题:

  1. 下面的第一个代码部分(由Adobe Illustrator制作)是否代表SVG文件中的三次贝塞尔曲线
  2. 如果是,在第一个(Adobe Illustrator)示例中,小写Cs后面的每个数字代表什么?

    Adobe Illustrator示例:

<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"表示绝对定位。在W3示例中,关于XYs分组的模式似乎相当明显。然而,我不知道如何看待Adobe Illustrator的例子,其中的组用负号分隔,没有逗号,例如:16.908-0.762在Adobe Illustrator示例中,小写Cs后面的编号序列是如何解析和分组的,在第一个(Adobe Illustror)示例中,这些数字分别代表什么

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

语法在这里

最新更新