Caman.js 渲染适用于以前的状态而不是画布的当前状态

Question

我正在通过 javascript 创建一个简单的图像编辑器，用户应该能够旋转图像以及应用一些由 Caman js 实现的过滤器。我正在以下画布中绘制初始图像：<canvas id="mainCanvas"></canvas>在我的 javascript 中，我有以下用于处理画布的代码：var canvasId = 'mainCanvas';var canvas = document.getElementById(canvasId);var ctx = canvas.getContext('2d');为了旋转图像，我使用了以下按预期工作的函数：function rotate(degree) {        ctx.clearRect(0, 0, canvas.width, canvas.height);        ctx.beginPath();        var img = new Image();        img.onload = function() {            ctx.save();            ctx.translate(img.width/2, img.height/2);            ctx.rotate(degree * Math.PI / 180);            ctx.drawImage(img, -img.width/2, -img.height/2, img.width, img.height);            ctx.restore();            processHistory('Rotate');        };        img.src = history[lastState];    }我可以多次旋转图像，每次旋转应用于图像/画布的当前状态时，它都可以正常工作。除了旋转之外，我还有一个由 Caman js 实现的噪声按钮，如下所示：Caman(canvas, val, function() {        this.noise(val).render(function() {            processHistory('Noise');        });    });在多次旋转的情况下，我可以多次向图像添加噪声，并且每次将噪声应用于图像/画布的当前状态。请注意，我的代码中的 history 是一个用于保存操作图像状态的数组，函数 processHistory 定义如下：function processHistory(){    history[lastState] = canvas.toDataURL();    lastState = lastState + 1;}问题考虑以下迭代Noise1 --> Rotation --> Noise2，即在原始图像上应用Noise1，然后应用 Rotation 和另一个 Noise ( Noise2 )。然后Noise2（管道中的第三步）不会应用于图像的当前状态（即带有Noise1和Rotation的图像），而是应用于带有Noise1的图像。我认为问题应该与Caman.js中定义的render函数有关，但我无法自己解决。所以它没有按预期工作，你能帮我修复我的代码或给我一些关于调试代码的想法。

Answer 1

我可以解决这个问题，这里有一个解决方案：只需使用以下回调调用旋转函数：

rotate(1, function() {

    Caman(canvas, function() {

        this.reloadCanvasData();

    });

});