javascript - 保存已使用 caman.js 操作的图像

Question

伙计们，我真的为此苦苦挣扎了几天，但没有运气，我用 camanjs 操作了一个图像，然后用 canvas.toblob() 将其保存到磁盘，这是代码

Caman("#theCanvas", "images/1.jpg", function () {

    this.greyscale()
        .noise(33.3)
        .render(function(){
            for(i=1;i<=3;i++){
                draw(2);
                draw(3);
                draw(4);
                draw(8);
            }
            for(i=1;i<=29;i++){
                draw(1);
                draw(5);
                draw(6);
                draw(7);
            }
            var canvas = document.getElementById("theCanvas");
            canvas.toBlob(function(blob) {
                saveAs(blob, "image.jpg");
            });
        });
});

保存图像时，它与 .greyscale 效果和 .noise() 效果一起保存，但我在 render() 函数中对图像所做的更改不存在于图像中，我不知道如何克服这个问题，我尝试过使用 .reloadCanvasData() 但它不起作用我认为我没有正确使用它，有人有解决方案吗？

Answer 1

也许你可以试试

.render(function(){
  var base64 = this.toBase64()
  download(base64, 'image.jpg', 'image/jpeg')
})

下载功能来自http://danml.com/download.html

Answer 2

我已经用我的以下技巧解决了这个问题。你可以使用它

 Caman("#canvas", function() {
          //console.log(this.toBase64());
        let a  = document.createElement('a');
            a.href = this.toBase64();
            a.download = Date() +'_image.png';
            a.click();
        });