Question

我有一个包含文本对象和矩形对象的组。当缩放组时，我希望矩形对象改变大小，但文本对象保持相同的大小。

有什么方法可以实现这个目标吗？

Answer 1

数学！救援！

看着小提琴！

http://jsfiddle.net/davidtorroija/w64bsnon/2/

＆＃13;

  var line;
  var canvas = this.__canvas = new fabric.Canvas('c');
  fabric.Object.prototype.originX = fabric.Object.prototype.originY = 'center';

  canvas.on({
    'object:scaling': function(p){
    	console.log('p',p.target.ScaleX )
      //p.target._objects[0].scaleX = p.target.scaleX
      //p.target._objects[0].scaleY = p.target.scaleY
      
      //p.target.scaleX = 1
      //p.target.scaleY = 1
			if (p.target.scaleX < 1)
      	p.target._objects[1].scaleX = 1 + (1 -p.target.scaleX )
      else
	      p.target._objects[1].scaleX = 1 / (p.target.scaleX)
      if (p.target.scaleY < 1)
      	p.target._objects[1].scaleY = 1 + (1 -p.target.scaleY)
      else
	      p.target._objects[1].scaleY = 1 / (p.target.scaleY)
  
      canvas.renderAll()
    },
  });
  
  var rect = new fabric.Rect({top: 110, left:110, height: 100, width: 100, fill:'#ccc'})
  
   var text = new fabric.IText('pepe',{text: 'pepe',top: 110, left:110, height: 100, width: 100, fill:'#000'})
  
  var group = new fabric.Group([rect,text])
  
  canvas.add(group)

＆＃13;

<script src="http://fabricjs.com/lib/fabric.js"></script>
<canvas id="c" width="600" height="600"></canvas>

＆＃13;

在Fabric组中缩放某些对象而不是其他对象？

1 个答案: