只是显示一些控件

时间:2017-04-25 15:20:17

标签: fabricjs

我在fabricjs中有一些线对象。当用户选择它们时,我希望在那里只是一个小盒子。一直到该行的矩形的默认选择形状不是我喜欢的。

我不需要控件,因为用户无法调整行的大小。但是出现在行尾的默认控件就可以了。我有什么方法可以只显示这两个控件吗?或者我最好只创建两个新的fabricjs对象并将它们粘贴在线的两端?

1 个答案:

答案 0 :(得分:1)

如果我理解正确

您可以使用 fabric.Object#setControlsVisibility来禁用单个控件,并且只能使用您想要的控件

并阻止对象缩放/调整大小,设置...

lockScalingX: true
lockScalingY: true

var canvas = new fabric.Canvas('canvas', {
    width: 635,
    height: 218,
});

line = new fabric.Line([50, 50, 200, 50], {
    strokeWidth: 5,
    stroke: 'black',
    hasBorders: false,
    hoverCursor: 'default',
    lockScalingX: true, // lock scaling
    lockScalingY: true  // ^^
});

// disable controls (except top-left and bottom-right)
line.setControlsVisibility({
    tr: false,
    bl: false,
    ml: false,
    mt: false,
    mr: false,
    mb: false,
    mtr: false
})

canvas.add(line);
body{margin:0;overflow:hidden}canvas{border:1px solid #d3d3d3}
<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.7.9/fabric.min.js"></script>
<canvas id="canvas"></canvas>