fabric.js 显示画布文本的镜像答案

【问题标题】：fabric.js to show mirror image of canvas textfabric.js 显示画布文本的镜像
【发布时间】：2013-08-31 05:41:33
【问题描述】：

我正在使用fabric.js 在画布上写文本。稍后单击按钮我想显示文本的镜像。 fabric.js 中是否有任何属性可以用来旋转画布上的文本。

document.getElementById( 'btn' ).addEventListener( 'click', function (e) {
    var obj = canvas.getActiveObject();

    if ( !obj ) return;

    //here comes code to show mirror image

    obj.set( 'fill', '#FF0000' );
    canvas.renderAll();
});

【问题讨论】：

标签： jquery html css fabricjs

【解决方案1】：

function flipX() {
    var obj = canvas.getActiveObject();
    if (obj) {
        obj.set('flipX', !obj.flipX);
        canvas.renderAll();
    }
}

function flipY() {
    var obj = canvas.getActiveObject();
    if (obj) {
        obj.set('flipY', !obj.flipY);
        canvas.renderAll();
    }
}

【讨论】：

【解决方案2】：

试试这段代码……我已经编辑过了……

document.getElementById('btn').addEventListener('click', function (e) {

    canvas.getActiveObject().set("angle", "-180").set('flipY', true);
    canvas.renderAll();

});

【讨论】：

我不想旋转我想翻转文字...就像镜子一样
你需要动画吗？
如何管理对象 i 层？我的意思是说，当我们在 css 中使用 z-index 时，我可以在这里使用什么来前后移动元素？
这些是使用的方法 canvas.sendBackwards(myObject) canvas.sendToBack(myObject) canvas.bringForward(myObject) canvas.bringToFront(myObject)
你可以检查一下这个小提琴jsfiddle.net/BTh6A/9，我想在文本区域更改后立即更改画布文本