无法使用 Fabric.js 调整大小 canvas/scale

Question

为了良好的用户交互，我需要将大的 canvas 显示为较小的，但稍后会上传大的 canvas。我正在使用 Fabric.js 并尝试使用 Canvas css 技巧，您可以在其中为 HTML 中的 canvas 设置 width/height，然后通过CSS 到此处记录的更小的一个：

当我尝试按如下方式调整大小时，它使 canvas 变为 300x150（默认 canvas）并且不符合我的 CSS。

HTML:

<canvas id="c"></canvas>

JavaScript:

var canvas = new fabric.Canvas('c', {
        });

canvas.width = 1000;
canvas.height = 1000;

CSS:

#c {
    width: 650px;
    height: 436px;
}

如何调整用户与之交互的 canvas 的 "size"，同时通过 fabric.js 保持较大 canvas 的 "actual size"？我也在使用 bootstrap，但不确定这是否会产生任何影响。

Answer 1

将您的 javascript 代码替换为：

 var canvas = new fabric.Canvas('c', {});  
    canvas.setWidth(1000) ;  
    canvas.setHeight(1000);

Can't resize canvas/scale using Fabric.js