零半径圆形<rect>的正确渲染是什么?

时间:2016-01-12 15:52:16

标签: svg language-lawyer

如何绘制此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)都是这样的:

enter image description here

这会将rx设置为等于ry的值。它是否正确? SVG spec说:

  
      
  1. 否则,如果为'ry'提供了正确指定的值,但没有为'rx'提供,则将rx和ry都设置为'ry'的值。
  2.   

但我不知道这是如何适用的,因为rx 正确指定的。规范仅限制负值:

  

对于圆角矩形,椭圆的x轴和y轴半径用于圆整矩形的角。任一属性的负值都是错误(请参阅错误处理)。

如果将rx视为0(而不是设置为ry),则会定义一个简并椭圆,这将使矩形不连续(即方形)角落:

enter image description here

根据规范,我的阅读会使这个行为正确,但我发现很难相信每个应用程序都错误地实现了它。

请注意,我并不是说观察到的行为不方便,也不需要任何解决方法。我只想知道它是否符合规范,如果是,那么规范中的哪种特定语言定义它?

1 个答案:

答案 0 :(得分:1)

根据SVG规范,<rect>应该没有圆角。 Firefox以编写的方式实现了SVG规范的这一部分。