请解释SVG路径命令和坐标 [英] Please explain SVG Path Commands and Coordinates

问题描述

在一个SVG文件中，我找到了一个看起来像这样的路径:

In an SVG file, I found a path which looks like this:

<path id="kvg:0548b-s7" kvg:type="㇐b" d="M65.32,48.38c5.65-0.95,12.61-2.46,18.92-3.42c2.05-0.45,4.13-0.5,6.23-0.13"/>

有人可以解释坐标48.38c5.65-0.95和18.92-3.42c2.05-0.45代表什么吗?

Can somebody explain what the coordinates 48.38c5.65-0.95 and 18.92-3.42c2.05-0.45 represent?

推荐答案

我认为某些困惑来自格式允许将各个参数分隔为各种路径操作数的技巧.因此，在示例中:

I think that some of the confusion comes from the tricks the format allows for separating individual parameters to the various path operands. So in the example:

M65.32,48.38c5.65-0.95,12.61-2.46,18.92-3.42c2.05-0.45,4.13-0.5,6.23-0.13

M65.32,48.38c5.65-0.95,12.61-2.46,18.92-3.42c2.05-0.45,4.13-0.5,6.23-0.13

您会看到参数

• 以逗号分隔，例如M(ove)65.32,48.38 ...
• 以连字符(减号)分隔，如c(ubic bezier)2.05-0.45 ...
• 由新操作数分隔，如... 48.38c5.65 ...
• 您还将看到用空格而不是逗号分隔的参数
• 如果前面的参数中包含句点，您甚至可能会看到由前导句点分隔的参数
• 有时您会在3.22e-9中看到科学计数法中的参数以消除零点

由于每种操作数正好需要一定数量的参数(M，L，T需要2； H，V需要1； Q，S需要4； C需要6； A需要7； Z需要0)，将看到省略操作数的情况.如果您看到L后面有4个参数，则实际上表示2行，C后面有18个参数表示3个立方贝塞尔曲线.

As each kind of operand needs exactly a certain number of parameters (M,L,T need 2; H,V need 1; Q,S need 4; C needs 6; A needs 7; and Z needs 0) you will see situations where operands are omitted. If you see a L with 4 parameters after it, it actually means 2 lines, a C with 18 parameters after it means 3 cubic Beziers.

所有这些都是为了最大程度地减少SVG中的浪费空间，而不仅仅是使其难以阅读.

This is all to minimize any wasted space in the SVG, and not just to make it hard to read.

这篇关于请解释SVG路径命令和坐标的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！