在调整大小和倾斜时更新织物 js 对象的坐标答案

【问题标题】：Update the coordinate of fabric js object on resize and skewing在调整大小和倾斜时更新织物 js 对象的坐标
【发布时间】：2017-10-01 11:44:43
【问题描述】：

我试图调整fabric js对象（矩形）的大小，它的宽度和高度没有更新。任何人都可以解决它。

【问题讨论】：

请给我们您的代码minimal reproducible example。没有任何代码，我们几乎不可能为您提供帮助。还请说明您迄今为止为解决此问题所做的尝试！

标签： jquery html canvas fabricjs

【解决方案1】：

您需要使用 scalex、scaleY、height 和 width 的计算来按比例设置高度和宽度。首先选择你的矩形对象。

在我的项目中，我使用下面的代码来更改矩形高度

var obj = canvas.getActiveObject();
var new_height = 100;
var w = obj.getWidth() * obj.getScaleX();
var h = parseFloat(new_height) * obj.getScaleY();
obj.setHeight(h);
obj.setWidth(w);
obj.setScaleX(1);
obj.setScaleY(1);
obj.setCoords();
canvas.renderAll();

与您可以使用以下代码更改矩形宽度相同

var obj = canvas.getActiveObject();
var new_width = 100;
var w = parseFloat(new_width) * obj.getScaleX();
var h = obj.getHeight() * obj.getScaleY();
obj.setHeight(h);
obj.setWidth(w);
obj.setScaleX(1);
obj.setScaleY(1);
obj.setCoords();
canvas.renderAll();

【讨论】：