How to draw arc in Fabric.js

你说的曾经没有我的故事 提交于 2019-12-12 10:53:09

问题


I'm working with Fabric.js and I would like to draw arcs on canvas. The closest shape I can find is the Circle shape. This, of course, only enables me to make a circle and nothing like an arc spanning 45° or 180°.

Is there a way to accomplish this with Fabric.js? If not, is there a way I can get the underlying context and then create the arc and allow fabric to manage it? It is important that I retain the selection and scaling capabilities that Fabric.js offers.


回答1:


In latest version of FabricJS for circle were added startAngle and endAngle properties. https://github.com/kangax/fabric.js/pull/1675

var canvas = new fabric.Canvas('c');

var circle = new fabric.Circle({
    radius: 20,
    left: 100,
    top: 100,
    angle: 45,
    startAngle: 0,
    endAngle: Math.PI,
    stroke: '#000',
    strokeWidth: 3,
    fill: ''
});

Example: http://jsfiddle.net/mmeqec89/



来源:https://stackoverflow.com/questions/25979688/how-to-draw-arc-in-fabric-js

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