Javascript fabricjs在其他元素进行缩放时，如何保持组元素的固定大小？

您好我使用fabricjs玩html画布。 我创建画布并在其上添加一组对象

在一组对象上，我需要在缩放对象时保持某些对象的固定宽度和高度

我使用'object:scaling'事件来获取活动对象，当它改变大小时，我读取组中的每个对象，并分配元素[I]。在我想要保持不变的组对象上设置（{'radius'：5}）

但结果是，所有组对象都需要调整大小。

我向您展示对象：缩放事件的片段：

 canvas.on('object:scaling',function(e){

        var activeObject1 = e.target;

        var elements = e.target._objects;

          var count_elements =  elements.length;


            for(var i = 0; i < count_elements; i++) {

                var type = elements[i].typeCircle;

                if(type == "parts"){
                                      //elements[i].set({"radius":8,"fill":"#abcde2","stroke":"#367827"});
                    //elements[i].set('radius',8);
                    /*elements[i].setWidth(16);
                    elements[i].setHeight(16);
                    elements[i].currentWidth = 16;
                    elements[i].currentHeight = 16;
                    elements[i].scaleX = 1;
                    elements[i].scaleY = 1;
                    console.log(elements[i]);
                    canvas.renderAll();*/
                }
              }
         });

canvas.on（'object:scaling'，函数（e）{
var activeObject1=e.target；
变量元素=e.target.\u对象；
var count_elements=elements.length；
对于（变量i=0；i

我应该在for循环中写入什么来保持某些对象的固定大小？ 我上面使用的所有东西，除了的“fill”：“#abcde2”，“stroke”：“#367827”

如果有人在fabricjs上遇到过类似的问题，请告诉我。

您必须使用setScaleX（）和setScaleY（）方法。 这里有一个例子

var Rect = new fabric.Rect({
  width: 200,
  height: 200,
  top: 100,
  left: 100,
  fill: 'rgba(255,0,0,0.5)',
  stroke: '#000',
  strokeWidth: 1,
});

var Circle = new fabric.Circle({
  left: 100,
  top: 100,
  fill: '#FF00FF',
  stroke: 'red',
  radius: 100,
  opacity: 1,
});

var Group = new fabric.Group([Rect, Circle])
canvas.add(Group)
canvas.on({
  'object:scaling': onChange
})

function onChange(obj) {
    var circle = obj.target.item(1),
        group = obj.target,
        scaleX = circle.width / group.getWidth(),
        scaleY = circle.height / group.getHeight();
    circle.setScaleX(scaleX);
    circle.setScaleY(scaleY);

}

---

使用fabricjs2停止文本项的缩放，我修改了Rafik Avtoyan的函数，使其工作正常。我已经为我的组锁定了Y缩放，因此如果需要，您必须添加此项

function handleScalingEvent(obj) {
    var text = obj.target.item(1),
        group = obj.target,
        scaleX = group.width / (group.width * group.scaleX);
    text.set('scaleX', scaleX);
}

---

使对象大小相同的最佳方法是将所需的宽度除以对象宽度。例如，如果您希望所有添加的对象都是256px，则代码将如下所示：

     function selectImage(imagePath){
        fabric.Image.fromURL(imagePath, function(oImg) {
            canvas.add(oImg);
            let zoom = 256 / oImg.width;
            oImg.set({ scaleX: zoom, scaleY: zoom, });
            oImg.center();
        });
    }

如果图像为64px，则将其缩放4到256px；如果图像为512px，则将其缩放0.5，从而使图像更小到256px