Javascript 如何使用CamanJS翻转画布

Javascript 如何使用CamanJS翻转画布,javascript,html,canvas,camanjs,Javascript,Html,Canvas,Camanjs,所以我想用CamanJS插件创建一个基于web的图像编辑器,它被证明是一个爆炸,但我需要创建一个水平翻转功能,结果CamanJS没有这样的方法,我正在考虑在Caman外翻转画布并像这样重新加载它 context.translate(imageWidth / 2, imageHeight / 2); context.scale(-1, 1); context.drawImage(imageObj, - imageWidth / 2, - imageHeight / 2, imageWidth, i

所以我想用CamanJS插件创建一个基于web的图像编辑器,它被证明是一个爆炸,但我需要创建一个水平翻转功能,结果CamanJS没有这样的方法,我正在考虑在Caman外翻转画布并像这样重新加载它

context.translate(imageWidth / 2, imageHeight / 2);
context.scale(-1, 1);
context.drawImage(imageObj, - imageWidth / 2, - imageHeight / 2, imageWidth, imageHeight);
caman.reloadCanvasData();

但是什么也没发生,任何人都可以帮忙吗?

如果您正在翻转填充画布的图像,请将其翻译到画布的右侧

context.translate( canvas.width,0  );
context.scale( -1,1 );
context.drawImage( imageObject,0,0 );

以下是flip插件的外观:

Caman.Plugin.register("flip", function () {
    var canvas, ctx;
    var width = this.canvas.width;
    var height = this.canvas.height;

    // Support NodeJS by checking for exports object
    if (typeof exports !== "undefined" && exports !== null) {
        canvas = new Canvas(width, height);
    } else {
        canvas = document.createElement('canvas');
        canvas.width = width;
        canvas.height = height;
    }

    ctx = canvas.getContext('2d');
    ctx.translate(width, 0);
    ctx.scale(-1, 1);
    ctx.drawImage(this.canvas, 0, 0);

    this.replaceCanvas(canvas);
    return this;
});

Caman.Filter.register("flip", function () {
    return this.processPlugin("flip");
});

仍然不起作用,问题是caman使用它自己的上下文,而我尝试使用caman外部的上下文翻转它,如果我删除caman,图像翻转很好,但如果我这样做,我将无法使用caman筛选器。你不能像上面那样在html画布中翻转图像。然后保存到图像:newImage.src=canvas.toDataURL()。然后将翻转后的图像作为起点输入到Caman中。看起来您从中复制/粘贴了代码