html2canvas image is not rendering fully on page scroll

Question

I am using html2canvas for exporting image using qlik mashup. Without page scroll, its working fine. But, when I scroll, the full chart is not visible on the screen; only partial/half of the image is rendering. Here is the screenshot:

I'm facing this issue only after scroll whether scroll upwards or downwards. Below is my code:

$scope.exportImg = function (object) {
      html2canvas(angular.element(document.getElementById(object))[0]).then(canvas => {
        var a = document.createElement('a');
        a.href = canvas.toDataURL("image/png");
        a.download = object + '.png';
        a.click();
      });
    }

<div class="export-excel export-excel-last" ng-click="exportImg(objectId)">Export As Image</div>

Please look at this fiddle. My concern is almost similar.

JSFIDDLE

Please suggest what could be the concern over here. Is there anything I am missing? I can't able to find the solution for this.