[html5] Fwd: HTML5 canvas suggestions

Sigurd Lerstad sigurd.lerstad at gmail.com
Thu May 9 07:22:15 PDT 2013


Rik,

On second thought... I don't see how your mask proposal would accomplish a
drawTintedImage()
drawTintedImage *multiples* each pixel in the image with an rgba value
before putting it on the canvas. Some Examples:

1,1,1,1  (same as drawImage)
1,1,1,0.5 (50% opacity)
1,0,0,1 (only red channel, g and b are black)


--
Sigurd Lerstad



2013/5/9 Rik Cabanier <cabanier at gmail.com>

>
>
> On Wed, May 8, 2013 at 4:02 PM, Sigurd Lerstad <sigurd.lerstad at gmail.com>wrote:
>
>> A few canvas API suggestions:****
>>
>> ** **
>>
>> 1)****
>>
>> drawTintedImage(image, tintR, tintG, tintB, tintA, ...)****
>>
>> the rest of the arguments would be the same as for drawImage****
>>
>> ** **
>>
>> What this method does is the same as drawImage, but it multiplies each
>> color component with the passed rgba values.
>>
>
> I think my proposal for 'maskImage' [1] allows you to do this too.
> You'd set an image and tell canvas to use either the alpha or luma values.
> You'd then draw a rectangle with the color you want as a tint.
>
>
>> ****
>>
>> ** **
>>
>> A search on google reveals that a lot of people want this feature, but
>> instead must resort to other slower solutions, like
>> getImageData/putImageData or drawing three separate images with compositing
>> of “lighter”. I myself also miss this feature.****
>>
>> ** **
>>
>> 2)****
>>
>> drawColorTransformedImage(image, colorTransform, ….)****
>>
>> ** **
>>
>> Basically same as above, but instead passes a complete 4x5 colorTransform
>> (either an array or some kind of ColorMatrix object ?)
>>
>
> I've seen proposals that allows you to set a CSS filter shorthand [2] in
> the canvas state. In theory you should be able to put any SVG in there but
> that *might* be slower.
> So:
>     ctx.save();
>     ctx.filters = "sepia(50%);
>     ctx.drawImage(...);
>     ctx.restore();
>
>
> 1:
> http://lists.w3.org/Archives/Public/public-whatwg-archive/2013Jan/0263.html
>
> 2: http://www.w3.org/TR/filter-effects/#ShorthandEquivalents
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.whatwg.org/pipermail/help-whatwg.org/attachments/20130509/7f1776bc/attachment-0003.htm>


More information about the Help mailing list