How to change Rotating point position to bottom in FabricJS?

随声附和 提交于 2019-12-11 01:13:12

问题



How to change "Rotating point" position to the bottom (see image below) ?

And here is the link guide to configuration controls point of selecting object. http://fabricjs.com/fabric-intro-part-4#customization

Thank you!


回答1:


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>


来源:https://stackoverflow.com/questions/52427490/how-to-change-rotating-point-position-to-bottom-in-fabricjs

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!