Javascript 为什么在使用html2canvas导出甘特图控制板时，PowerPoint演示文稿是空白的？

我使用web技术创建了一个自定义甘特图仪表板。我还使用

html2canvas

创建了一个“导出到PowerPoint”功能

虽然它曾经在Chrome的早期版本中工作，但在最新版本中却没有。将仪表板导出到PowerPoint时，我得到一个空白演示文稿

单击“导出”按钮时，我正在从HTML页面调用

exportPPT

函数

这是我的代码：

let callDownloadPPT = function (pngUrl) {
    $('#p_loader').show();

    let property = {
        name: "Project name",
        heading: "",
        subheading: ""
    };

    Service.downloadPPT(pngUrl, property)
        .then(function successCallback(response) {
            if (response &&
                response.data &&
                response.data.status === "success" &&
                response.data.variable &&
                response.data.variable.row.column) {
                $scope.downloadUrl = $sce.trustAsResourceUrl(response.data.variable.row.column);

                let _template = '<iframe id="exportIframe" src="' + $scope.downloadUrl + '" style="display: none; visibility: hidden; width: 1px; height: 1px;"></iframe>';
                angular.element(document.getElementById('downloadIframe')).append($compile(_template)($scope));
            }

            $('#p_loader').hide();

        }, function errorCallback(error) {
            $('#p_loader').hide();
        });
};


$scope.exportPPT = function () {
    $(document).ready(function () {
        // Check if document width is higher than window width :)
        if ($(document).width() <= $(window).width()) {
            document.getElementById('downloadIframe').innerHTML = "";
            $('#p_loader').show();

            html2canvas($("#gantt-chart-full"), {
                allowTaint: true,
                onrendered: function (canvas) {
                    var myImage = canvas.toDataURL("img/png");
                    let base64String = /,(.+)/.exec(myImage)[1];
                    callDownloadPPT(base64String);
                }
            });
        } else {
            document.getElementById('downloadIframe').innerHTML = "";
            $('#p_loader').show();
            html2canvas($("#gantt-chart-full"), {
                height: $("#gantt-chart-full").get(0).scrollHeight,
                width: $("#gantt-chart-full").get(0).scrollWidth,
                logging: true
            }).then(function (canvas) {
                var myImage = canvas.toDataURL("img/png");
                let base64String = /,(.+)/.exec(myImage)[1];
                callDownloadPPT(base64String);
            });
        }
    });
};

let callDownloadPPT=function（pngUrl）{
$（'p#u loader'）.show（）；
let属性={
名称：“项目名称”，
标题：“，
副标题：“
};
服务下载PPT（pngUrl，属性）
.then（函数成功回调（响应）{
如果（答复）&&
答复.数据&&
response.data.status==“成功”&&
response.data.variable&&
response.data.variable.row.column）{
$scope.downloadUrl=$sce.trustAsResourceUrl（response.data.variable.row.column）；
让_template=''；
element（document.getElementById（'downloadIframe'））.append（$compile（_-template）（$scope））；
}
$（'p#u loader'）。隐藏（）；
}，函数errorCallback（错误）{
$（'p#u loader'）。隐藏（）；
});
};
$scope.exportPPT=函数（）{
$（文档）.ready（函数（）{
//检查文档宽度是否高于窗口宽度：）
if（$（document）.width（）我有调试代码，仅在最新的chrome版本中出现此错误。未能在“CanvasRenderingContext2D”上执行“drawImage”：提供的值不是类型（CSSImageValue或HTMLImageElement或SVGImageElement或HTMLVideoElement或HtmlCanvaElement或ImageBitmap或OffscreenCanvas）“。我有调试代码，仅在最新的chrome版本中出现此错误。未能在“CanvasRenderingContext2D”上执行“drawImage”：提供的值不是类型”（CSSImageValue或HTMLImageElement或SVGImageElement或HTMLVideoElement或HtmlCanvaElement或ImageBitmap或OffscreenCanvas）”。