Skip to content

请问下有没有对纹理加入滤镜的计划? #6

@willove

Description

@willove

首先先对大大的引擎点个赞,已经用到了公司的项目里。
最近有对图片进行对图片填充颜色的需求,类似于那种剪影的效果。但是从引擎的API上面没有找到对应的方法,再查引擎也没有响应的实现。
针对这个问题我参照纹理fromColor的实现,在原型dispose方法下面新建了一个fillColor方法,原理是把纹理图片转成canvas再进行像素处理,希望大大可以考虑一下更好的实现。

    fillColor: function(RGBA, repaint) {
        var data = document.createElement('canvas'),
            ctx = data.getContext('2d'),
            imageData,
            brightness;
        repaint = _.isUndefined(repaint) ? true : repaint;
        data.width = this.__data.width;
        data.height = this.__data.height;
        ctx.drawImage(this.__data, 0, 0, data.width, data.height, 0, 0, data.width, data.height);
        imageData = ctx.getImageData(0, 0, data.width, data.height);
        for (i = 0; i < imageData.data.length; i += 4) {
            brightness = repaint ? 1 :
            ((0.34 * imageData.data[i] + 0.5 * imageData.data[i + 1] + 0.16 * imageData.data[i + 2]) / 255);
            imageData.data[i] = brightness * RGBA[0]; // r
            imageData.data[i + 1] = brightness * RGBA[1]; // g
            imageData.data[i + 2] = brightness * RGBA[2]; // b
            imageData.data[i + 3] = imageData.data[i + 3]; // alpha
        }
        ctx.putImageData(imageData, 0, 0);
        this.__data = data;
    }

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions