将反应组件转换为html

我有一个包含地图的反应组件（使用反应传单 ）。
我正在试图在客户端截图（使用html2canvas ），将其转换为HTML，然后将其发送到我的NodeJS服务器来创buildPDF（使用html-pdf ）。
问题是地图从外部URL加载它的瓷砖，所以当我尝试截图时，我得到一个空白的背景。

这里是我想要截图的组件：
反应地图组件

PDF格式的结果如下：
截图图片

我用过的代码：
在客户端： 

// mapComponent is a div containing the component of the map. let input = document.getElementById('mapComponent'); html2canvas(input) .then((canvas) => { let imgData = canvas.toDataURL('image/png'); sendAjaxRequest(imgData); });

在服务器上： 

 let html = '<!DOCTYPE html><html><head></head><body><div>' + '<img src="' + imgData + '">' + '</div></body></html>'; let options = { format: 'A4', orientation: 'portrait' }; pdf.create(html, options).toFile('./file.pdf', (err, res) => { });

帮助将不胜感激。

Interesting Posts