meltingice / CamanJS

Javascript HTML5 (Ca)nvas (Man)ipulation
http://camanjs.com
BSD 3-Clause "New" or "Revised" License
3.56k stars 406 forks source link

Opacity Filter for image is not there. #230

Open inkxe-vasanth opened 6 years ago

inkxe-vasanth commented 6 years ago

We need opacity for the image -

I have added this code to camenjs, it's working for me fine. Review the code add it if feel useful.

Code

Filter.register("opacity", function (adjust) {
        adjust = Math.floor(255 * (adjust / 100)); 
        var imageData = this.imageData.data,
            length = imageData.length;
        // set every fourth value to 50
        for (var i = 3; i < length; i += 4) {
            imageData[i] = imageData[i] == 0 ? imageData[i] : adjust;
        }
        // after the manipulation, reset the data
        this.imageData.data = imageData;
        this.context.putImageData(this.imageData, 0, 0); 
    });
av01d commented 5 years ago

This works better:

Caman.Filter.register('opacity', function(adjust) {
    adjust = Math.floor(255 * (adjust / 100));
    var inputData = this.pixelData, length = inputData.length;
    // Adjust alpha channel (every 4th value):
    for (var i = 3; i < length; i += 4) {
        inputData[i] = inputData[i] == 0 ? 0 : adjust;
    }
});