CamanJS - 替换实例答案

【问题标题】：CamanJS - replace instanceCamanJS - 替换实例
【发布时间】：2019-01-18 16:33:22
【问题描述】：

如果我有一张要应用滤镜的图片，例如Lomo 过滤器，有没有办法让它成为当前的 Caman 实例？

意思是，如果我想在应用了滤镜的图像上调整亮度，并使用this.revert(); 重置亮度，我希望它恢复到带有滤镜的画布我刚申请。

这可能吗？

我正在做一场噩梦，试图应用许多效果，一次只能应用一个（预设过滤器除外），并通过...

【问题讨论】：

这可能值得在 github 上询问 Caman.js 的创建者：github.com/meltingice/CamanJS/issues
@Mike'Pomax'Kamermans - 谢谢，已经这样做了，但还没有回复
您是否找到了可行的解决方案，因为我也在考虑这个问题？

标签： javascript html5-canvas camanjs

【解决方案1】：

如果我理解，您想应用their example page 上显示的过滤器（“Lomo”），然后调整一些属性（如亮度），然后将更改恢复为“Lomo”过滤器？

为什么不再次点击过滤器（“Lomo”）？

编辑：您可能应该看看guide 并使用过滤器中的默认值实现您自己的方法。

u.Filter.register("lomo", function (D) {
        if (D == null) {
            D = true
        }
        this.brightness(15);
        this.exposure(15);
        this.curves("rgb", [0, 0], [200, 0], [155, 255], [255, 255]);
        this.saturation(-20);
        this.gamma(1.8);
        if (D) {
            this.vignette("50%", 60)
        }
        return this.brightness(5)
    });

我不认为您的要求是“开箱即用”的。

【讨论】：

不，我想应用 ("Lomo") 滤镜，然后可能会在滤镜顶部添加一些亮度和对比度。每次更改后，例如亮度（我可能会选择添加亮度值 10，但这还不够，所以决定 15 会更好），为了保存它以指数方式添加它，它会恢复到原始实例（在本示例中，以避免将 15 添加到已经使用10，另外，加 10 然后加 -10 和根本不加是不一样的）。这会破坏任何更改，例如("Lomo") 过滤器设置。
目前我每次应用可能添加的东西时都会换出一个临时图像，但它很麻烦而且效率很低。希望这是有道理的
可能最好的办法是实现自己的方法和内部的 twerk 属性。
谢谢，但这根本不会像这样工作，因为我正在使用所有过滤器和几乎所有过滤器（可能是错误的词）例如亮度、对比度等，这是我要求的重点。跟踪状态很棘手。并非不可能，我现在正在做，但是，它比我想要的要复杂得多
您不能只调用一个缓存每个设置的函数，然后重新应用（注册？）这些设置+您对同一张图像的新调整吗？

【解决方案2】：

如果我理解正确，您想应用滤镜并使用其他效果，例如亮度和对比度等，
我编写了一些代码，可以根据您的需要工作

 Caman('#canvas-camanImage',"./../media/caman.png", function () {
        this.revert(false);
        for(var i = 0 ;i<selectedPresets.length;i++){
            this[selectedPresets[i]]();
        }
        for(var key in effect){
            this[key](effect[key].value);
        }
        this.render(function () {
        });

在上面的代码中，我将所有效果（例如亮度对比度）存储在效果变量中，例如effect = { brightness : { min : -100, max: 100, value : 0 }, contrast : { min : -100, max: 100, value : 0 }, saturation : { min : -100, max: 100, value : 0 } };

并在数组中预设

presets = [
    {filter:'vintage',name : 'Vintage'},
    {filter:'lomo',name:'Lomo'},
    {filter: 'clarity', name:'Clarity'},
    {filter:'sinCity', name:'Sin City'}
    ];

因此，每次您添加任何预设或更改任何效果值时，我都会更改变量中的值并再次渲染画布
对我来说效果很好
如果您担心其他问题，请告诉我

【讨论】：