2016-04-12 7 views
0

円のボーダー半径を変更する方法を私はこれは私の円オブジェクトがfabricJSにはfabricJS

です...私はオブジェクト(if scaleX/scaleY>1)を拡張する場合、円のborder-radiusを変更したい:

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を変更するにはどうすればよいですか?私はあなたができないと信じて

+0

のHTML elemetsは境界半径プロパティ自体を使用して、円形/ラウンド行われます。では、なぜ円の上にボーダー半径が必要ですか? – AdityaParab

+0

ボーダー半径はどういう意味ですか?あなたはオブジェクトを拡大縮小するときに薄い境界線が必要なのですか? – AndreaBogazzi

+0

@AdityaParabサークルを少し変更したいです。今度はボーダー半径は50%です。。私がスケールするときは、10pxになります。 – Moran

答えて

0

これはあなたが探しているものであるかどうかを確認するためにスニペットを確認してください。 StrokeWidthはスケーリングの際にコストがかかります。

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); 
 
});
<script src="http://www.deltalink.it/andreab/fabric/fabric.js"></script> 
 
<canvas id="c" width="500" height="500"></canvas>

関連する問題