[whatwg] Request: Canvas Tag CSS

Ian Hickson ian at hixie.ch
Fri Jun 5 01:13:23 PDT 2009

On Thu, 30 Apr 2009, Charles Pritchard wrote:
> On Thu, 30 Apr 2009, Ian Hickson wrote:
> > 
> > For simple things, e.g. colours or fonts, you can use 
> > getComputedStyle() on the <canvas> itself to get styles from the CSS, 
> > and use those in the JS instead of hardcoding the values. But this 
> > doesn't work as a general solution for multiple colours, gradients, 
> > etc.
> >
> > It's not clear to me how to solve this problem in general, e.g. for 
> > things like gradients and patterns, where CSS doesn't really match the 
> > way canvas works. Short of inventing a bunch of new syntax, I don't 
> > know what to do.
> If you want to declare gradients, using available standards, the SVG 
> name space supports both gradient types. And in your Canvas code you can 
> reconstruct them with minimal effort.
> HTML5 at least admits the existence of SVG. You can embed an SVG 
> fragment [or reference] in your HTML for various styling reasons, to 
> support a Canvas without actually using SVG for display / rendering. See 
> the <defs> tag. Useful for Glyphs (embedded font), Gradients and Filter 
> graphs.

If we could find a good mapping from SVG to <canvas> for concepts such as 
these, then that might work, yes. I'm not really sure it really solves the 
styling problem (we'd just be moving the hard-coded stuff from the script 
to the SVG, not all the way to the CSS), and indeed maybe SVG itself 
should have ways to do this better from CSS.

In any case, I think this is not something we should address in this 
version of the <canvas> API. I'd rather wait until we have more experience 
with <canvas> to find out what authors really want here.

Ian Hickson               U+1047E                )\._.,--....,'``.    fL
http://ln.hixie.ch/       U+263A                /,   _.. \   _\  ;`._ ,.
Things that are impossible just take longer.   `._.-(,_..'--(,_..'`-.;.'

More information about the whatwg mailing list