如何将canvas的起源设置为以fabricjs为中心？

Question

当我在fabricjs画布上画一个圆时，即使将坐标设置为居中，它总是出现在右下角。我怎样才能使画布的圆圈画中心？

var circle = new fabric.Circle({ 
     top: 300, 
     left: 300, 
     radius: 100 
}); 

Answer 1

您可以设置画圆对象中心的原点，用originX和originY财产。

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

 
var circle = new fabric.Circle({ 
 
    top: 100, 
 
    left: 100, 
 
    radius: 50, 
 
    originX: 'center', 
 
    originY: 'center' 
 
}); 
 

 
canvas.add(circle);

canvas{border:1px solid #ccc}

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.7.14/fabric.min.js"></script> 
 
<canvas id="c" width="200" height="200"></canvas>

Answer 2

你有centerObject（）。

 canvas.add(oImg) 
    canvas.centerObject(circle); 
    canvas.renderAll(); 

将您的圆圈设置在画布中央。