FabricJs 1.7.18 scaleToWidth()不设置给定的宽度(FabricJs 1.

2019-10-28 08:21发布

按照这个答案我已经建立fabricJs版本1.7.18启用所有功能- 内置输出文件 。

我使用下面的代码来改变对象的宽度和高度使用scaleToWidth(),但新的宽度值设置不正确。 它是设置与一些其它值的宽度。

var obj = canvas.getActiveObject();

obj.scaleX = 1;
obj.scaleY = 1;
obj.scaleToWidth(65);
obj.setCoords();

canvas.renderAll();

//This gives a different width value
console.log(obj.getWidth()); 

谁能帮我解决这个问题?

我的实际要求是:要相对设置的高度时,我设置对象的宽度。 例如:我有宽度50和高度40。如果我设置使用函数setWidth()的宽度为100的对象,则没有任何内置函数来设置高度为80?

Answer 1:

正如提到的scaleToWidth秤一个目的是给定的宽度,相对于边界框(由X / Y同样缩放)。

getWidth返回对象边框计数转换的宽度。

如果你只是想设置一个对象使用的宽度obj.width = value

您可以使用规模()或将scaleX(),的scaleY()来缩放对象。

DEMO

 (function() { var canvas = this.__canvas = new fabric.Canvas('c'); var rect = new fabric.Rect({ left:50,top:50,width:50,height:40 }) canvas.add(rect); rect.scale(2); rect.setCoords(); console.log(rect.height,rect.scaleY) })(); 
 canvas{ border-width: 1pz; border-style: solid; border-color: #000; } 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/2.0.0-rc.3/fabric.js"></script> <canvas id='c' width=300 height=300></canvas> 

当你知道你正在设置宽度。 计算差值多少百分比的方式改变设置相同的身高。 你会得到的结果。



文章来源: FabricJs 1.7.18 scaleToWidth() not setting the given width