Javascript 使用Fabric.js进行交互式绘图

我正在尝试使用Fabric.js进行交互式绘图。现在我可以用鼠标画一个矩形了。但在我完成绘制矩形后，我无法选择它，除非在绘制后使用左上角控制器调整它的大小一次。我想知道是什么打破了活动系统

这是我的密码：

更新小提琴

对于更改位置/标注相关属性（左、上、比例、角度等）时的对象，集不会更新对象边界/控件的位置

如果您需要更新这些，请致电：

---

setCoords（）

太棒了！它起作用了！谢谢你，约翰！但是你似乎忘记了更新小提琴。有人知道为什么这在Firefox中不起作用吗？在Chrome和IE 11中工作正常。

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

    var rect = new fabric.Rect({
        top : 100,
        left : 100,
        width : 60,
        height : 70,
        fill : 'red'
    });

    canvas.add(rect);

    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.saveState();
            });


        }
    });

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