Question

我创建了一个组：

var text    = new fabric.Text(textValue,{left: 20, top: 30, fontSize:25});
var rect    = new fabric.Rect({
                    width       : text.get('width') + 40,
                    fill        : "#FFFFFF",
                    height      : 100,
                    stroke      : '#000000',
                    strokeWidth : 1

                  });

    var myGroupObj = new fabric.CustomGroup([  rect,text ], {
      left      : 0,
      top       : 0,
    });

现在，当我手动调整组的大小时，我希望获得一个新的高度。

myGroupObj.get('height')

我总是持续一个（100）。索姆想要获得新的高度，好吗？

Answer 1

您应该调用.height函数，而不是访问getHeight()属性，该函数会为您提供结构的实际高度（您在屏幕上看到的高度） .js对象。在您在jsfiddle上创建的代码中，为了获得真正的高度，您应该将行alert(activeObject.height);更改为alert(activeObject.getHeight());，您将看到差异。

干杯，贡萨洛加布里埃尔

Answer 2

在手动调整http://jsfiddle.net/islyoung2/7Tf22/4/后，我找到了获取对象新高度的解决方案。

var newHeight = myGroupObj.get('height') * myGroupObj.get('scaleY')

谢谢。

Answer 3

设置新宽度或新高度时，请不要忘记同时更新scaleX和scaleY：

canvas.on("object:modified", function (e) {
    var activeObject = e.target;
        if (!activeObject) {
            return;
    }
    var newWidth = activeObject.width * activeObject.scaleX ;
    var newHeight = activeObject.height * activeObject.scaleY ;

    activeObject.width = newWidth;
    activeObject.height = newHeight;

    activeObject.scaleX = 1;
    activeObject.scaleY = 1;                
});

fabric.js - 重新定义后获得新的高度

3 个答案: