在查看Snap.svg tutorial时,我遇到了以下一行代码,这些代码让我做了双重考虑:
// Now lets create pattern
var p = s.path("M10-5-10,15M15,0,0,15M0-5-20,15")
什么是M10-5-10,15
?起初,我认为它可能是某种坐标范围的语法,但在这种情况下这并没有多大意义,而且我找不到与SVG path spec中的任何东西非常接近的东西。我在Snap.svg docs中找不到任何注意事项。
有趣的是,该代码似乎确实draw the desired pattern ...
答案 0 :(得分:4)
simplest answer通常是正确的。 没有特殊的语法 - 坐标只是连在一起,没有空格。
线索是命令:M
是moveto
命令,它通常不会绘制任何东西。但是,如果您查看the spec,则会注意到以下内容:
如果一个moveto后跟多对坐标,那么 后续对被视为隐式lineto命令。
因此,moveto
实际上可以有多个坐标对,并且第一对之后的任何内容都被视为lineto
命令。实际上,神秘语法只是一种简洁(但不太可读)的写作方式M10,-5 -10,15 M15,0 0,15 M0,-5 -20,15
,连字符是负面符号。
简单地查看SVG path grammar也清楚地表明moveto
的参数是坐标对,坐标是简单的数字。
我认为要带走的关键是SVG路径确实不需要空格或逗号,除非没有它们,数字会模糊不清。