小编Ped*_*ose的帖子

我正在尝试研究如何使用工作人员来处理fabricJS画布HTML5，并最大限度地减少后台代码执行的影响。

HTML5 API 我在OffScreenCanvas中看到了一个允许在工作人员内部管理画布的界面。

我想知道是否可以将此接口与FabricJS.

我需要在用fabricJS制作的应用程序中，当我使用缩放处理程序修改对象时，缩放保持在1，并且对象的大小采用高度乘以scaleX的值。我可以对宽度应用相同的方法。但我无法将其应用到图像中。我怎样才能解决这个问题？

我留下了一个正方形和图像的示例小提琴，以便您可以看到结果。

图像中的结果类似于裁剪，我无法避免这种情况，因为显然，当我修改图像的容器时，也包含并且scaleX不会scaleY更改的 _element 属性，因此图像不会在容器内调整大小。这是jsFiddle。

var canvas = new fabric.Canvas('canvas');
var rect1 = new fabric.Rect({
    width: 100,
    height: 100,
    left: 200,
    top: 200,
    angle: 0,
    fill: 'rgba(0,0,255,1)',
    originX: 'center',
    originY: 'center'
});

canvas.add(rect1);
fabric.Image.fromURL('http://fabricjs.com/assets/pug_small.jpg', function(myImg) {
    //i create an extra var for to change some image properties
    var img1 = myImg.set({
        left: 0,
        top: 0,
        width: 150,
        height: 150
    });
    canvas.add(img1);
});
canvas.on('mouse:up', function(e) {
    /*if(e.target != null){
        //alert(e.target.width*e.target.scaleX);

    }*/
    //console.log(e.target);
    canvas.getActiveObjects().forEach(function(obj) {
        //if(obj.get('type')!='image'){ …

我想在缩放对象时获得真实的对象宽度和高度。我试过

canvas.on('object:scaling', function(e){
  console.log(e.target.width*e.target.scaleX);
});

但似乎不能正常工作。