Question

我正在尝试将Caman.js过滤器功能添加到paper.js Raster中。为了不丢失图像信息，我想在每次通过从克隆光栅复制Caman来调用Caman之前将图像数据重置为原始数据（_camanImageData）。代码是这样的：

with(paper) {
    Raster.prototype._camanImageData = null;
    Raster.prototype.filter = function(options) {

        var self = this,
            ctx = this.getContext(),  // caution! This also inits this._canvas (should).
            size = this._size;

        if( !this._camanOrgImage ) {
            this._camanOrgImage = this.clone(false);
        } else {
            var dst = ctx.createImageData(size.width, size.height);

            dst.data.set(this._camanOrgImage.getImageData(new Rectangle(0, 0, size.width, size.height)).data);
            this.setImageData(dst);
        }

        Caman(this._canvas, function () {

            for( option in options ) {
                var value = options[option];

                this[option](value);
            }

            this.render(function () {
                self._changed(129);
            });
        });
    };
}

第一个电话正常。第二个显然是在已修改的数据上。

我像这样调用过滤器函数：

raster.filter({
    brightness: 50,
    saturation: 10,
    hue: 20,
});

我做错了什么？

Answer 1

问题在于卡曼。如果在canvas元素中设置了“data-caman-id”属性，则Caman不会重新加载已更改的画布。只需在调用Caman之前删除它，它就可以正常工作：

>>> map(int, ['1,2,3,4,5,6,7,8'][0].split(','))
[1, 2, 3, 4, 5, 6, 7, 8]

解决方案来自：How can I change out an image using CamanJS?

如何将画布图像数据复制到paper.js光栅对象中

1 个答案: