Re: [css3-images] Gradient Magic

On Thu, Jul 21, 2011 at 6:10 PM, Tab Atkins Jr. <jackalmage@gmail.com>wrote:

> On Tue, Jul 19, 2011 at 2:15 PM, Alexander Shpack <shadowkin@gmail.com>
> wrote:
> > On Sat, Jul 16, 2011 at 11:10 PM, Behnam Esfahbod ZWNJ <behnam@zwnj.org>
> wrote:
> >> Hi,
> >>
> >> Implementing the CSS3 Linear Gradient for another application, I
> >> noticed one very useful gradient style is almost undoable using the
> >> latest syntax. This style is when you want gradient colors from A to B
> >> to C, with A on the bottom-right, C on the top-left, and B on the
> >> top-right and bottom-left. (In the attached screenshot, A = red, B =
> >> white, and C = blue.) This
> >
> > IMHO, this is not a part of Linear Gradient, it should be Gradient Mesh
> >
> > background-image: gradient-mesh(
> > /* A point */    0 0 red,
> > /* B point */    right top white,
> > /* C point */    0 100% red,
> > /* D point */    left bottom white
> > );
> >
> > Then, authors may create any gradients
>
> After two days of teaching myself the basics of computer graphics and
> mesh gradients, then putting it all together into a canvas-based mesh
> gradient draw-er, I can confidently state that you're wrong.  It would
> take *two* mesh gradients to duplicate image.  ^_^
>
> (It wasn't wasted time - I've had a lot of fun being frustrated by
> graphics math.)
>
>
What type of meshes were you looking at? Simple lattice or Coons/Tensor
product patch?
Even you can't draw the stated gradient with 1 patch mesh, you could do it
with a larger number of patches. In PDF/Postscript this collection of
patches is called a gradient mesh.
I'm not sure if there is a need for such a complicated beast in CSS.

Rik

Received on Monday, 25 July 2011 06:35:44 UTC