Question

我正试图在画布的正中心画一条线。现在我正在使用一种hacky方法。

// Centered Line
fabric.Image.fromURL('https://i.imgur.com/zM63v6J.png', function(myImg) {
  var img1 = myImg.set({
    left: 306,
    selectable: false,
  });
  canvas.add(img1);
});

这可以完成工作，但我确信有更轻松的方法可以做到这一点。

非常感谢任何帮助。提前致谢

Answer 1

var canvas = new fabric.Canvas('c');
var line = new fabric.Line([canvas.width/2,0,canvas.width/2,canvas.height],{
  strokeWidth:2,
  stroke: 'red',
});
canvas.add(line);

canvas{
 border: 2px dotted black;
}

<script src="https://rawgithub.com/kangax/fabric.js/master/dist/fabric.js"></script>
<canvas id="c" width="500" height="500"></canvas>

您可以将此线坐标[canvas.width/2,0,canvas.width/2,canvas.height]用于垂直中心线。

使用fabricjs在画布中心绘制一条垂直线？

1 个答案: