摆脱Fabric.js中的旋转控制
摆脱Fabric.js中的旋转控制
提问于 2018-07-06 23:41:08
In this jsfiddle我有一个用lockRotation: true创建的Fabric.js文本，以避免旋转。线条消失了，但要旋转的框控件还在，该如何摆脱它？
HTML
<canvas id="c" width="300" height="300"></canvas>Javascript
var canvas = new fabric.Canvas('c');
var text = new fabric.IText('This is the text',{
left: 50,
top: 50,
fontFamily: 'Arial',
fontWeight: 'normal',
fontSize: 18,
lockRotation: true,
stroke: 'black',
fill: 'black'
});回答 3
Stack Overflow用户
回答已采纳
发布于 2018-07-07 03:00:37
使用object.hasRotatingPoint = false；隐藏旋转点。
var canvas = new fabric.Canvas('c');
var text = new fabric.IText('This is the text',{
left: 50,
top: 50,
fontFamily: 'Arial',
fontWeight: 'normal',
fontSize: 18,
hasRotatingPoint: false,
stroke: 'black',
fill: 'black'
});
canvas.add(text);<script src="https://rawgit.com/kangax/fabric.js/master/dist/fabric.js"></script>
<canvas id="c" width="300" height="300"></canvas>
Stack Overflow用户
发布于 2021-03-18 21:56:43
接受的答案对于从4.0开始的Fabricjs版本不再有效(请参阅changelog)。hasRotatingPoint已经被移除，取而代之的是一个更全面的控件应用编程接口，尽管它的documentation仍然非常精简。
若要对特定对象隐藏某个控件，必须重新定义其controls属性。下面是隐藏mtr控件(旋转)的方法：
text.controls = {
...fabric.Text.prototype.controls,
mtr: new fabric.Control({ visible: false })
}
var canvas = new fabric.Canvas('c');
var text = new fabric.IText('This is the text',{
left: 50,
top: 50,
fontFamily: 'Arial',
fontWeight: 'normal',
fontSize: 18,
stroke: 'black',
fill: 'black'
});
text.controls = {
...fabric.Text.prototype.controls,
mtr: new fabric.Control({ visible: false })
}
canvas.add(text);<script src="https://rawgit.com/kangax/fabric.js/master/dist/fabric.js"></script>
<canvas id="c" width="300" height="300"></canvas>
在这里，我们使用文本的默认控件创建了一个新的控件对象，但是重新定义了mtr集。
Stack Overflow用户
发布于 2022-02-16 12:22:06
使用setControlsVisibility，它适用于所有对象类型的fabricjs
fabric.Image.fromURL(src, (img) => {
var oImg = img.set({
left: 0,
top: 0,
})
oImg.setControlsVisibility({ mtr: false })
canvas.add(oImg)
canvas.setActiveObject(oImg)
canvas.renderAll()
}
let newtext = new fabric.Textbox(text, {
left: 0,
top: 0,
originX: 'center',
originY: 'center',
fontFamily: 'Inter',
fill: '#fff',
textAlign: 'center',}
)
newtext.setControlsVisibility({ mtr: false })
canvas.add(newtext)
canvas.setActiveObject(newtext)
canvas.renderAll()页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51213760
复制相关文章
相似问题