RE: [css3-images] asymmetric radial gradients

SVG's clamping is described here:

http://www.w3.org/TR/SVG/pservers.html#RadialGradients
# If the point defined by 'fx' and 'fy' lies outside the circle defined
# by 'cx', 'cy' and 'r', then the user agent shall set the focal point
# to the intersection of the line from ('cx', 'cy') to ('fx', 'fy') with
# the circle defined by 'cx', 'cy' and 'r'.

Granted that SVG doesn't capture the elliptical case directly here, but with a transform applied (or coordinate system with aspect ratio other than 1) the ellipse scenario can be represented via SVG.

-Brian


-----Original Message-----
From: Brian Manthos [mailto:brianman@microsoft.com] 
Sent: Monday, October 31, 2011 12:05 PM
To: fantasai; www-style@w3.org
Subject: RE: [css3-images] asymmetric radial gradients

fantasai:
>On 10/30/2011 11:27 PM, Brian Manthos wrote:
>> http://msdn.microsoft.com/en-us/library/dd368149(VS.85).aspx
>> In D2D, this is addressed with the gradientOriginOffset parameter:
>> "In the brush's coordinate space, the offset of the gradient origin relative to the gradient ellipse's center."
>>
>> To support it, it would be straighforward to expand the syntax from (one proposal):
>> radial-gradient(<size>  [at<position>]?,<color-stop>[,<color-stop>]+)
>>
>> to (another proposal):
>> radial-gradient(<size>  [at<position>  [offset<length>{2}]? ]?,<color-stop>[,<color-stop>]+)
>
> That seems reasonable... but what happens if the offset places the
> gradient center outside the 100% ellipse?

I haven't fiddled with it, so I'd have to get back to you on the D2D answer.

That said, for CSS my instinct is....

We should clamp offset values to inside the ellipse (or do some other normalization).  Once the offset goes outside the ellipse it's becoming more of a conical gradient and thus doesn't really belong under the radial-gradient umbrella.

But this is just off the cuff, not deeply thought out.

Received on Monday, 31 October 2011 19:35:35 UTC