Re: [css3-background][css-shapes] spread rounding

On 11/18/13 1:17 PM, "Alan Stearns" <stearns@adobe.com> wrote:

>On 11/18/13 10:47 AM, "fantasai" <fantasai.lists@inkedblade.net> wrote:
>
>>On 11/15/2013 10:18 AM, Lea Verou wrote:
>>> Sooo, after some discussion at TPAC after the recent F2F, some of us
>>>(fantasai, dbaron, plinss, me) decided that even though
>>> the edge cases about precision aren't that big of a problem, the
>>>currently defined behaviour results in abruptness when
>>> border-radius interpolates from 0 to any positive value. Therefore, we
>>>think the spread rounding should be changed to be
>>> defined as:
>>>
>>> spread rounding = border-radius + spread * ratio(x)
>>>
>>> where x = border-radius / spread and ratio() is a continuous strictly
>>>increasing function that is 0 when border-radius is 0
>>> and becomes 1 after a certain point. Therefore, it would still be 0 at
>>>0 and mostly the same for small differences between the
>>> border-radius and the spread size, but would progressively increase
>>>when the border-radius is considerably smaller than the
>>> spread size.
>>>
>>> We tried many functions for what ratio() could be [1], and I made a
>>>demo of the three best ones that you can find here [2]. We
>>> think Cubic works best, which is 1 + (x-1)^3 in [0,1] and 1 when x > 1.
>>>Not only this makes interpolation smoother, but it
>>> also is more aesthetically pleasing, which reduces the need for manual
>>> ©÷filleting©÷ (as demonstrated in [3]).
>>
>>Given the results from
>>   http://dev.w3.org/csswg/css-backgrounds/spread-radius

>>and how much better the outer edge looks with the cubic
>>interpolation, I'm thinking we should do the same for
>>the margin box curve for Shapes.
>>
>>Alan, thoughts?
>
>I think that would be fine.

I have added a <box> section to shapes, with two examples [1]. I expect
I'll need to add more detail. Please take a look.

Thanks,

Alan

[1] http://dev.w3.org/csswg/css-shapes/#shapes-from-box-values

Received on Tuesday, 19 November 2013 00:33:08 UTC