如何绘制此SVG文档?它是一个圆角矩形,X半径显式设置为零,Y半径为非零:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 288 216" height="3in" width="4in">
<g>
<rect
rx="0"
ry="36"
y="36"
x="54"
height="108"
width="162" />
</g>
</svg>
在浏览器上试试这个jsfiddle。
我尝试的每个程序(Inkscape,Chrome,Safari,IE 11)都是这样的:
这会将rx
设置为等于ry
的值。它是否正确? SVG spec说:
- 否则,如果为'ry'提供了正确指定的值,但没有为'rx'提供,则将rx和ry都设置为'ry'的值。
醇>
但我不知道这是如何适用的,因为rx
是正确指定的。规范仅限制负值:
对于圆角矩形,椭圆的x轴和y轴半径用于圆整矩形的角。任一属性的负值都是错误(请参阅错误处理)。
如果将rx
视为0(而不是设置为ry
),则会定义一个简并椭圆,这将使矩形不连续(即方形)角落:
根据规范,我的阅读会使这个行为正确,但我发现很难相信每个应用程序都错误地实现了它。
请注意,我并不是说观察到的行为不方便,也不需要任何解决方法。我只想知道它是否符合规范,如果是,那么规范中的哪种特定语言定义它?
答案 0 :(得分:1)
根据SVG规范,<rect>
应该没有圆角。 Firefox以编写的方式实现了SVG规范的这一部分。