使用Fabric.js在中心绘制带有直线的矩形

Question

请帮助我如何绘制矩形连接中心线，如图所示 下面是我在画布上向下绘制矩形的代码，我想要做的是在矩形的中心画一条线，这将使它成为我画布的一个形状

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

        canvas.on('mouse:down', function (option) {
            console.log(option);
            if (typeof option.target != "undefined") {
                return;
            } else {
                var startY = option.e.offsetY,
                    startX = option.e.offsetX;

                console.log(startX, startY);

                var rect2 = new fabric.Rect({
                    top : startY,
                    left : startX,
                    width : 0,
                    height : 0,
                    fill : 'transparent',
                    stroke: 'red',
                    strokewidth: 4
                });

                canvas.add(rect2);
                console.log("added");
                canvas.on('mouse:move', function (option) {
                    var e = option.e;
                    rect2.set('width', e.offsetX - startX);
                    rect2.set('height', e.offsetY - startY);
                    rect2.setCoords();
                });


            }
        });

        canvas.on('mouse:up', function () {
            canvas.off('mouse:move');
        });

<canvas id="canvas" width="500" height="500" style="border: 1px solid red;"></canvas>