Javascript 如何使用openlayers div创建pdf文件

我试图找到一个解决方案，以创建一个pdf文件与开放层

我有一个div，其中包含用openlayers创建的WMTS tiles，我想用它为我的用户创建一个pdf文件。我试着在网上发泄，但没有找到解决办法

在这里的mapContainer将创建所有我的openlayers WMTS磁贴，并使用该磁贴创建一个pdf文件，该文件将直接下载到用户PC中

---

我之前使用过

window.print（）

，但它会截断一些用户可见的地图数据。请提供任何可能的解决方案。

我记得Openlayers3提供了一个打印PDF示例（）

导出PDF示例
.地图{
最大宽度：566px；
}
页面大小
A0（慢）
A1
A2
A3
A4
A5（快速）
决议
72 dpi（快速）
150 dpi
300 dpi（慢速）
导出PDF
var raster=新建ol.layer.Tile({
来源：new ol.source.OSM（）
});
var format=new ol.format.WKT（）；
var feature=format.readFeature(
'多边形（（10.689697265625-25.0927734375，34.595947265625'+
'-20.1708984375, 38.814697265625 -35.6396484375, 13.502197265625 ' +
'-39.1552734375, 10.689697265625 -25.0927734375))');
feature.getGeometry（）.transform（'EPSG:4326'，'EPSG:3857'）；
var vector=新的ol.layer.vector({
来源：新ol.source.Vector({
特色：[特色]
})
});
var map=新ol.map({
图层：[光栅，矢量]，
目标：“地图”，
控件：ol.control.defaults({
AttributeOptions:/**@type{olx.control.AttributeOptions}*/({
可折叠：错误
})
}),
视图：新ol.view({
中间：[0,0]，
缩放：2
})
});
变量dims={
a0:[1189841]，
a1:[841594]，
a2:[594420]，
a3:[420297],，
a4:[297210]，
a5:[210148]
};
var加载=0；
var=0；
var exportButton=document.getElementById（'export-pdf'）；
exportButton.addEventListener（'click'，function（）{
exportButton.disabled=true；
document.body.style.cursor='progress'；
var format=document.getElementById（'format'）。值；
var resolution=document.getElementById（'resolution'）。值；
var dim=dims[格式]；
变量宽度=数学圆（尺寸[0]*分辨率/25.4）；
变量高度=数学圆（尺寸[1]*分辨率/25.4）；
var size=/**@type{ol.size}*/（map.getSize（））；
var extent=map.getView（）.calculateExtent（大小）；
var source=graster.getSource（）；
var tilleoadstart=函数（）{
++装载；
};
var tilleoadend=函数（）{
++装载的；
如果（加载===加载）{
var canvas=这个；
setTimeout（函数（）{
加载=0；
加载=0；
var data=canvas.toDataURL（'image/png'）；
var pdf=新的jsPDF（“横向”，未定义，格式）；
pdf.addImage（数据，'JPEG'，0,0，dim[0]，dim[1]）；
pdf.save（'map.pdf'）；
source.un（'tilleoadstart'，tilleoadstart'）；
source.un（'tileloadend'，tileloadend，canvas）；
source.un（'TilleLoadError'，TilleLoaded，canvas）；
地图。设置大小（大小）；
map.getView（）.fit（范围、大小）；
renderSync（）；
exportButton.disabled=false；
document.body.style.cursor='auto'；
}, 100);
}
};
map.once（'postcompose'，函数（事件）{
source.on（'tilleoadstart'，tilleoadstart'）；
on（'tileloadend'，tileloadend，event.context.canvas）；
on（'tileloaderror'，tileLoaded，event.context.canvas）；
});
地图设置尺寸（[宽度，高度]）；
fit（范围，/**@type{ol.Size}*/（map.getSize（））；
renderSync（）；
}，假）；