使用垂直滚动条拆分大图像，以多页导出到PDF

Question

我正在div元素中使用PrimeNG水平树https://www.primefaces.org/primeng/#/tree来以图表格式呈现来自某些服务的数据。

 ....
 <div class ="col-11">
 <div id="pTree">
 <p-tree [value]="data" layout="horizontal"></p-tree>
 </div>
 </div>
 ....

然后使用jspdf和html2canvas将树图像导出为PDF：

 exportPdf() {
 let doc = new jsPDF("l", "mm", "a4");
 var image: HTMLElement = document.getElementById("pTree");
 var divHeight = image.offsetHeight;
 var divWidth = image.offsetWidth;
 var ratio = divHeight/divWidth;
 html2canvas(image).then(function (canvas){
 var width = doc.internal.pageSize.getWidth();
 var height = doc.internal.pageSize.getHeight();
 height = ratio * width;
 var imgData = canvas.toDataURL("image/png");
 doc.addImage(imgData, "JPEG", 0,0, width, height);
 doc.save("pTree.pdf");
 });

当数据太大时，div将获得一个垂直滚动条，而document.getElementById仅捕获当前在屏幕上可见的图像数据，而不捕获隐藏的数据。我需要捕获div中的所有图像数据，并将大图像拆分为PDF中的多个页面，而又不影响图像质量。我该如何实现？有人可以帮忙吗。