- From: Rik Cabanier <cabanier@gmail.com>
- Date: Thu, 16 Aug 2012 09:54:55 -0700
- To: David Geary <david.mark.geary@gmail.com>
- Cc: "whatwg@whatwg.org" <whatwg@whatwg.org>, Ronald Jett <rjett@level-studios.com>, "Tab Atkins Jr." <jackalmage@gmail.com>, Chris Marrin <cmarrin@apple.com>, Ashley Gullen <ashley@scirra.com>
File a bug on it: https://www.w3.org/Bugs/Public/enter_bug.cgi?product=HTML%20WG Describe what you want to see. Ie a new filter property that take the same argument as a CSS filter ( https://dvcs.w3.org/hg/FXTF/raw-file/tip/filters/index.html#FilterFunction ) On Thu, Aug 16, 2012 at 8:52 AM, David Geary <david.mark.geary@gmail.com>wrote: > It looks like there is general agreement that CSS filters should be added > to Canvas. Now how do we make it happen? > > > david > > > On Sun, Jul 29, 2012 at 6:10 AM, Ashley Gullen <ashley@scirra.com> wrote: > >> Re: beginGroup()/endGroup(): I assume browsers would implement it as an >> offscreen canvas anyway, so it would be better to write a JS library to >> take care of it for you rather than requiring a browser feature for that. >> >> You would not need to rotate or scale the off-screen canvas. You'd make >> it the size of the main canvas, draw everything with all the >> rotation/scaling you want, then just draw it over the main canvas at (0, 0) >> with 100% scale. This will not affect antialiasing or artwork compared to >> just drawing it directly to the main canvas. Fancier implementations can >> work out the changed bounding box and only draw that with the effect for >> efficiency. >> >> Re: CORS - good point. Perhaps we should disallow custom shaders until >> this is figured out better (presumably it would have to be done the same >> way as WebGL). We can still add the stock CSS filter effects like blur, >> grayscale, contrast etc. without any CORS concern, though. >> >> Re: bounding boxes - I'm not sure why this needs to be included? CSS >> filters are smart enough to work out adjusted bounding boxes for HTML >> images and divs, so can't the drawImage() call also work out the adjusted >> bounding box necessary? If the bounding box really must be separately >> provided for some reason, then perhaps there could be a drawImage() >> overload that also accepts a CSS filter string (e.g. "blur(10px)") and a >> bounding box parameter? >> >> Ashley >> >> >> On 29 July 2012 00:27, Rik Cabanier <cabanier@gmail.com> wrote: >> >>> >>> >>> On Sat, Jul 28, 2012 at 1:58 PM, Ashley Gullen <ashley@scirra.com>wrote: >>> >>>> On another note, wouldn't it be nice if you could add a grouping >>>>> operator such as this: >>>>> >>>>> gamecanvascontext.filter = '...'; >>>>> gamecanvascontext.beginGroup(); >>>>> ... // lots of drawing operators >>>>> gamecanvascontext.endGroup(); >>>>> >>>>> and have everything in that group at endGroup time? >>>>> >>>> >>>> Do you mean applying an effect to multiple draw operations? >>>> >>> >>> True, but you would have to know the size of the offscreen canvas which >>> is sometimes hard. >>> I'm unsure what happens if you scale or rotate that offscreen canvas. >>> Will the artwork and text antialias correctly? How does the up/downsampling >>> happen? >>> >>> >>>> Usually that is achieved with rendering to an offscreen canvas, then >>>> rendering that with the effect. >>>> >>> >>> True, but you would have to know the size of the offscreen canvas which >>> is sometimes hard. >>> I'm unsure what happens if you scale or rotate that offscreen canvas. >>> Will the artwork and text antialias correctly? How does the up/downsampling >>> happen? >>> >> >> >
Received on Thursday, 16 August 2012 16:55:33 UTC