本文介绍了如何在FabricJS中将旋转点位置更改为底部?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
如何将旋转点"的位置更改为底部(请参见下图)?
How to change "Rotating point" position to the bottom (see image below) ?
这是选择对象的配置控制点的链接指南. http://fabricjs.com/fabric-intro-part-4#customization
And here is the link guide to configuration controls point of selecting object.http://fabricjs.com/fabric-intro-part-4#customization
谢谢!
推荐答案
只需使用角度将圆旋转180度,如果对象不是圆,则旋转点"位于底部,添加flipY混合以保持物体直立.
Just use the angle to rotate the circle 180 degrees and the "Rotating point" will be at the bottom, if the object is something other than a circle add flipY to the mix to keep the object upright.
<canvas id="canvas" width="170" height="170"></canvas>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/2.3.4/fabric.min.js"></script>
<script>
var obj = new fabric.Triangle({
fill: 'lime',
top: 110,
left: 110,
angle: 180,
flipY: true,
borderColor: 'red',
cornerColor: 'cyan',
cornerSize: 9,
transparentCorners: false
});
var canvas = new fabric.Canvas('canvas');
canvas.add(obj);
canvas.setActiveObject(canvas.item(0));
</script>
这篇关于如何在FabricJS中将旋转点位置更改为底部?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!