Question

我的图像大小调整问题。我想调整图像的大小但不保持比例。当我使用setHeight（）时，它给了我错误的值。

image.setHeight(100);
image.getHeight(); // gives me 140px output

当我使用缩放功能时，一切正确，但它也保持图像比率

image.scaleToHeight(100);
image.getHeight(); // correct 100px output

此测试也给了我奇怪的价值：

console.log("h: " + image.getHeight()); // 348.25870646766174
image.set({ height : image.getHeight()-10 });
console.log("h: " + image.getHeight()); // 235.6030791317047

编辑：

更多代码：

var flatImage = document.getElementById("flat-image");

var canvas = new fabric.Canvas("frame-canvas",{                         
        width: 992,
        height: 450
});

var image = new fabric.Image(flatImage, {});
    image.selectable = false;
    // image.scaleToWidth( 250 );

canvas.add(image);
canvas.centerObject(image);
canvas.renderAll();

console.log("h: " + image.getHeight()); // 334
image.set({ height : image.getHeight()-10 });
console.log("h: " + image.getHeight()); // 324 works good

但是当我添加scaleToWidth（）时，高度值会变得奇怪：

image.scaleToWidth( 250 );

console.log("h: " + image.getHeight()); // h: 166.66666666666666
image.set({ height : image.getHeight()-10 });
console.log("h: " + image.getHeight()); // h: 78.17697937458415

基本上削减一半然后减去给定值。

为什么？

Answer 1

该片段看起来不错。我无法想到获得不同价值观的任何其他原因，请稍微查看比例属性img.scaleX和img.scaleY，并确保它们等于1 ，否则会导致问题。

祝你好运

Fabric.js setHeight（）和scaleToHeight（）给出不同的高度值

1 个答案: