如何使用Fabricjs将画布对象重绘为更大的画布

时间:2014-10-15 07:16:49

标签: javascript html5 canvas fabricjs

在我的页面中我有小型​​和大型画布,我的用户看到的是一个小画布,中间有默认行..当用户移动它时,我需要在较大的画布中重绘它以便用户导出时它,它是一个伟大的形象。

看看我的小提琴样本

Links: http://jsfiddle.net/mailightkun/kahsomv7/10/

1 个答案:

答案 0 :(得分:0)

我过去必须这样做。

此函数将画布中的所有对象克隆到另一个对象,并允许您指定左右顶部偏移:

function cloneObjects(from_canvas, to_canvas, o_top, o_left) {

    var objects = from_canvas.getObjects();
    for (var i in objects) {

        var object = fabric.util.object.clone(objects[i]);
        var x = object.x;
        var y = object.y;
        var left = object.left;
        var top = object.top;
        object.x = o_left + x;
        object.y = o_top + y;
        object.left = o_left + left;
        object.top = o_top + top;

        object.name += '-export';

        object.setCoords();

        object.selectable = false;

        to_canvas.add(object);


    }

    to_canvas.calcOffset();
    to_canvas.deactivateAll().renderAll();
}

请告诉我这是否符合您的要求。