canvg

canvg toDataURL not returning full image with large chart


I have chart with 4000 x 10000(+). While converting the image it is returning 4000 x 8000 image which is not full image.

Code : var canvas = document.createElement('canvas'); 
canvg(canvas, this.canvas.toSVG());  // this : rapheal object
var img = canvas.toDataURL('image/jpeg');

Solution

  • The max resolution supports 8192 px. So solve this problem by compress the image to max height of 8192 px if the height is more than that using scaleHeight property.

    var maxChartHeight = 8192;
    canvgOpt.scaleHeight = Math.min( canvas.height, maxChartHeight );
    canvg( chartCanvas, canvas.toSVG(), canvgOpt );