javascript - 调整 Fabricjs 矩形的大小以保持边框大小

Question

我想调整 Fabricjs 矩形的大小而不是缩放它，但在拖动调整大小 handle 时我看到了奇怪的行为。边界开始消失或重复。我已经尝试过fabricjs的稳定版本1.7.19和beta 2.0.0。

这是我正在使用的代码的本质:

canvas.on('object:scaling', function(){
    var obj = canvas.getActiveObject(),
        width = obj.width,
        height = obj.height,
        scaleX = obj.scaleX,
        scaleY = obj.scaleY;

    obj.set({
        width : width * scaleX,
        height : height * scaleY,
        scaleX: 1,
        scaleY: 1
    });
});

此处的工作示例:https://codepen.io/bramchi/pen/GMLYEV/

尝试通过拖动调整大小 handle 将其放大或缩小一点。

Screenshot of scaling up and down issues

我期望发生的是拖动 handle 时矩形会增大和缩小，并且边框大小保持不变。但不知怎的，如果你超过 270px 左右，渲染就会开始变得疯狂。当释放鼠标按钮时，它会再次正确渲染。

我做错了什么？谁知道修复方法？或者这可能是我可以报告的库中的错误？

Answer 1

禁用对象缓存以避免这种渲染行为:

fabric.Object.prototype.objectCaching = false;

出于性能原因Fabric.js caches objects默认情况下，在拖动、旋转、倾斜和缩放操作期间。 Fabric.js 存储库的一位版主为我指明了正确的方向，为他万岁!