如何禁用选择freedrawing fabricjs

时间:2014-07-30 13:40:32

标签: fabricjs

在FabricJs中使用FreeDrawing绘制内容后,您可以选择绘制的内容并移动它。有没有办法禁用此选择?

3 个答案:

答案 0 :(得分:22)

如果您不需要在画布上进行任何互动,可以使用 StaticCanvas

var canvas = this.__canvas = new fabric.StaticCanvas('c');

或者,如果您只想禁用特定对象的选择,即最后一次画笔笔划,您可以在每次创建笔划时尝试调用以下代码:

canvas.item(0).selectable = false;
canvas.renderAll();

如果您需要其他对象的交互性,您也可以在画布初始化后立即定义

fabric.Object.prototype.selectable = false;

所有新对象都是不可选择的,除非您在创建可选对象时另行指定

var text = new fabric.Text('Honey,\nI\'m subtle', {
    fontSize: 250,
    left: 50,
    top: 0,
    selectable: true // make this object selectable
});
canvas.add(text);

答案 1 :(得分:0)

如果在某些对象中需要交互性而在所有对象中都不需要交互,则可以在创建非交互式对象时设置:evented: false

http://fabricjs.com/docs/fabric.Rect.html#evented

答案 2 :(得分:0)

也可以禁用可选角落/边框和/或控件。这是完整的代码:

    var canvas = this.__canvas = new fabric.Canvas('c');    
    fabric.Object.prototype.transparentCorners = false;
    canvas.selection = false;
    fabric.Image.fromURL(src, function (img) {

        height = img.getBoundingRectHeight();
        width = img.getBoundingRectWidth();

        var oImg;
        oImg = img
            .set({ hasControls: false, hasBorders: false, selectable: false })
            .scale(factor);
        canvas.add(oImg).renderAll();
        canvas.setActiveObject(oImg);
    }, { crossOrigin: 'anonymous' });