W3C home > Mailing lists > Public > www-style@w3.org > September 2010

Re: Linear gradients, Transforms and angles...

From: Brad Kemper <brad.kemper@gmail.com>
Date: Thu, 23 Sep 2010 17:48:00 -0700
Message-Id: <08F7EC0A-559D-4A48-B91D-DB9FCC0C47C5@gmail.com>
Cc: Chris Marrin <cmarrin@apple.com>, Simon Fraser <smfr@me.com>, DanielGlazman <daniel.glazman@disruptive-innovations.com>, "L. DavidBaron" <dbaron@dbaron.org>, "Tab Atkins Jr." <jackalmage@gmail.com>, www-style list <www-style@w3.org>
To: David Singer <singer@apple.com>

On Sep 23, 2010, at 9:40 AM, David Singer <singer@apple.com> wrote:

> On Sep 23, 2010, at 0:13 , Brad Kemper wrote:
>>> CSS is a language in which you express geometric concepts textually, not wysiwyg.  
>> Not always true. Many people only deal with it through an interface of a tool, such as Adobe DreamWeaver, Apple iWeb, etc.
> Those tools are free to abstract and 'simplify' in any way they wish.  I'm quite sure that programmers who can write a wysiwyg CSS editor can handle it.

So? The point is that we should be creating something that is author-friendly, whether using WYSIWYG or not. It would be odd to type 45 into the editor field and seeing 315deg in the resulting source. 

>>> I think users want rotations (transforms) and gradients to be consistent --
>> Well, you do, clearly, any way.
> Consistency within a specification is way more important than rough consistency with other tools and other systems.

The same unit can have different effects in different contexts. Take percentages for instance, which might be percentages of the element, the parent, etc. 

But with degrees, it always consistently means 1/360 of a circle, whether you are actually totally something, or just picking a linear direction. 

>>> that two, at 45º, go the same way.  
>> They don't. One goes in a straight direction, the other goes in a circular direction.
> I have no idea what you mean by this.  We're talking about an element rotated by X, and an element with a gradient rotated by X.  Not radial gradients.

Linear gradients. The thing about them is that they are linear. As in "line". A straight direction. They are therefore different from, say, 'transform:rotate()' in which something is actually rotated. Most authors will not think of a 45deg linear gradient as being a left-right angle that has been rotated 45deg. It is just a direction, a straight direction. NOT something that has been rotated. That direction is measured in degrees because it can be thought of as a ray pointing outward from it's starting point, as if you centered a protractor on that point. There is a relative distance of circular arc that (when measured in degrees) tells you what direction the ray is pointing, but the ray itself is one-dimensional in its direction, unlike an actual rotation. 

So just because linear directions and rotations both are measured in degrees does not mean that you can't intuitively have positive numbers mean clockwise for _rotations_, but still follow the standard geometry convention for specifying _linear_ direction. 

>>> not have to remember that there are two somewhat intuitive, but different, conventions at work depending on what they are working with.
>> That is exactly what you are asking designers and other authors to do when they use normal angle notation everywhere in life except CSS, SVG, and Canvas.
> I am asking for the spec. to be consistent within itself.  Consistency with other systems is secondary.

There is nothing inconsistent, unless when you insist on thinking of a gradient's linear direction as being a rotated version of a zero degree gradient, and not a 2-dimensional direction in and of itself. Your way of thinking may come from an understanding of a detail of how it is implemented, but is not required for an internally consistent way of understanding the spec. 

"North" is another example of linear direction. It is not a rotated version of some default "East" or "West".  It is just "North".  No rotation is necessary in order to understand it. 

>> The convention of saying that a 45° angle goes from lower-left to upper-right is much older than any of those, and is what most people will expect. You want to use a different convention for CSS, because of some reason of mathematical purity in regard to the direction of the Y axis, which I could care less about.
> (could care less -> could not care less, I suspect.)

Let's not get I to that. 

> This is about having a specification in which coordinates, axes, rotations, and the like, are consistently specified.  Mathematical purity and consistency are also important, but less so.  Matching wysiwyg tools is less so.

I want to match common convention, so that authors do not have to pry apart the implementation logic in order to know what angle yo enter. 

> It seems that your basic beef may be with someone in the mists of time who decided that on computers the visual Y axis goes downward; ...

Not at all. PhotoShop has a downward progressing positive number Y axis, AND clockwise rotation transforming, AND gradients based on the common convention of a protractor-like angles to specify direction. It is all very intuitive, and I've never heard of people complaining about the incongruity you see there. I'm perfectly fine with all three of those things, no beef at all. I would have a beef with Adobe if they made me have to convert from common expectations to something else whenever I wanted to indicate a linear direction. 

>> I just want to use the angles that are most familiar to me (and others like me) for specifying linear direction.
> Then use a wysiswyg tool that makes the transform, since you want consistency with wysiwyg tools.

Are you saying that CSS should not be sensible to authors without special tools to decipher their meaning? Remarkable!  

> Either way we decide, we'll probably need a note, by the way.  "Warning, linear gradient angles in CSS are specified in the CSS coordinate system in which the Y axis is downwards, and hence a 45º gradient also goes downward from the horizontal."  "Warning, linear gradient angles are specified in CSS on a different coordinate system from the rest of the specification; a 45º gradient goes upward, away from the Y axis, which goes downward, and a 45º gradient and a 45º rotation are therefore at 90º to each other."

Oh, like the warning we have for the "right" property? "Warning! Distances for 'right' are are specified in CSS on a different coordinate system from the rest of the specification; a positive distance goes leftward, so  a 10px 'right' value and a 10px 'left' value are actually, and shockingly, displaced in opposite directions from one another." Oh wait, we don't have that warning.  

Or, we can just say, "Linear directions in CSS are indicated using conventional notations in which positive numbers progress counter clockwise, and a zero degree angle points rightward. Rotational directions (in rotational transforms, for instance) are indicated using positive numbers to indicate clockwise rotation. With rotational directions, there is no notion of zero degrees having to 'point' anywhere, and is simply equivalent to 'unrotated'." 

Do you seriously think that using positive numbers to indicate clockwise rotations for rotating, while also using positive numbers to indicate a counterclockwise arc of difference from "rightward" for linear direction, is such a fundamental upheaval of the underlying math, that it will cause more confusion than not using conventional ways of indicating linear direction?
Received on Friday, 24 September 2010 00:48:45 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:31 GMT