Question

我希望在缩放对象（border-radius）时更改圆圈的if scaleX/scaleY>1 ...

这是我在fabricJS中的圈子对象：

function makeStation(left, top, stationID) {
    var c = new fabric.Circle({
        radius: 2,
        fill: '#5afffa',
        stroke: '#666',
        selectable: true,
        hasRotatingPoint: false,
        borderColor: 'black',
        cornerColor: 'black',

    });
    c.left1 = left;
    c.top1 = top;
    c.hasControls = c.hasBorders= true;

    c.stationID = stationID;
    c.stationName = stations[stationID].name;
    c.description = stations[stationID].desc;
    c.image = stations[stationID].image;

    return c;
}

如何更改border radius？

Answer 1

我相信你不能，我认为边界是由画布的selectionLineWidth控制的：

http://fabricjs.com/docs/fabric.Canvas.html#selectionLineWidth

Answer 2

请检查代码段，看看这是不是您要找的内容。 StrokeWidth在缩放时保持恒定。

＆＃13;

var canvas = new fabric.Canvas("c");

canvas.add(new fabric.Circle({radius: 50, fill: 'red', stroke: 'black', strokeWidth:2}));

canvas.on("object:scaling", function(opt){
  var t = opt.target;
  
  t.strokeWidth = 2/Math.min(t.scaleX, t.scaleY);
});

＆＃13;

<script src="http://www.deltalink.it/andreab/fabric/fabric.js"></script>
<canvas id="c" width="500" height="500"></canvas>

＆＃13;

如何在fabricJS中更改圆的边界半径

2 个答案: