我正在使用fabricjs操纵画布,并通过JavaScript加载图像。
我有一个函数,用于调整画布大小以使其响应式,并希望调整已加载的背景图像以适合画布,但保持长宽比。
目前我还没有找到符合我的要求的示例,希望有人能提供帮助。
Javascript
var canvas = new fabric.Canvas('drawing_layer');
var img = new Image();
img.onload = function () {
canvas.setBackgroundImage(img.src, canvas.renderAll.bind(canvas), {
originX: 'left',
originY: 'top',
left: 0,
top: 0
});
// initially sets width of canvas to fit the image
canvas.setDimensions({
width: img.width,
height: img.height
});
};
// below is a call to function that resizes the canvas
resizeCanvas();
//sets listener to resize event
window.addEventListener('resize', resizeCanvas);