My original size of the canvas
is 800X700
.
I am using clipTo
to work in a selected portion of a canvas:
var rect = new fabric.Rect({
left: 100,
top: 50,
fill: '#fff',
width: 376,
height: 602,
strokeWidth: 0,
selectable: false
});
rect.set({
clipFor: 'mainCanvas',
});
I make sure all the images and text fall within this portion of the canvas.
What I want to Do:
I want to scale up this portion of canvas to a width and height of 1500X2400
so that it can be used for printing
I am using the below toDataURL
function with multiplier as 3
var imgData= canvas.toDataURL({
format: 'png',
width: 376,
height: 602,
top: 50,
left: 100,
multiplier: 3
});
But I am getting only top most portion of the image. Any solution?
Update: More info about the problem
I am using Ubuntu 16.04 and Fabric.js-1.6.2
Demonstrating the problem on JsFiddle
When I click on the enhance image
button, only the top left portion of the image is displayed.