织物js中的Canvas客户端大小

Question

在通常的画布css宽度和客户端宽度可能不相等，如何在Fabricjs上得到这个？ 举个例子：我想要一个内部有1280 * 720px图像的640 * 360px画布。 我知道我可以缩放图像，但dataUrl会给我一个更小的图片，不是吗？

Answer 1

有一个解决方案 。 您可以使用CSS大小初始化Fabric.js，然后使用backstoreOnly标记setDimensions或使用所需客户端大小初始化init，并使用带有cssOnly标志的setDimensions 。 示例＃1：

var canvas = new fabric.Canvas('c', {width: 640, height: 360});
canvas.setDimensions({width: 1280, height: 720}, {backstoreOnly: true});

示例＃2：

var canvas = new fabric.Canvas('c', {width: 1280, height: 720});
canvas.setDimensions({width: '640px', height: '360px'}, {cssOnly: true});

Answer 2

您可以使用画布的setWidth / setHeight属性更改画布的大小http://fabricjs.com/docs/fabric.StaticCanvas.html#setWidth

例如

canvas = new fabric.Canvas('c');
canvas.setWidth(640);
canvas.setHeight(360);

虽然你应该澄清你的意思。