首页 > 解决方案 > 为什么我不能在 ie 11 中获取 canvas todataurl?

问题描述

我尝试将图表从 xml 渲染到 svg,然后 svg 在画布中绘制并保存在计算机上。

ie 11 中的 Canvas.toDataUrl() SecurityError,但对于谷歌浏览器来说很好。如何解决此问题与相同,但对我 的渲染图文件没有帮助

请帮我。

我有这个功能

 $('#exportBtn').click(function () {
            var object = new Object();
            object.xml=xml;
            render(object)
            var svg = document.querySelector("svg");
            var img = document.createElement("img");
            var canvas = document.createElement("canvas");

            var svgSize = svg.getBoundingClientRect();
            canvas.width = svgSize.width * 3;
            canvas.height = svgSize.height * 3;
            canvas.style.width = svgSize.width;
            canvas.style.height = svgSize.height;

            var svgData = new XMLSerializer().serializeToString(svg);

            var svg64 = btoa(svgData);
            var b64Start = 'data:image/svg+xml;base64,';
            var image64 = b64Start + svg64;

            img.onload = function () {
                var ctx = canvas.getContext("2d");
                ctx.scale(3, 3);
                var x0 = Math.floor(0);
                var y0 = Math.floor(0);
                ctx.translate(-x0, -y0);           
                var bg = graph.background;

                if (bg == null || bg == '' || bg == mxConstants.NONE) {
                    bg = '#ffffff';
                }

                ctx.save();
                ctx.fillStyle = bg;
                ctx.fillRect(x0, y0, Math.ceil(svgSize.width * 3), Math.ceil(svgSize.height * 3));
                ctx.restore();
                ctx.drawImage(img, 0, 0,canvas.width,canvas.height);
                var canvasdata = canvas.toDataURL("image/png", 1);
                var a = document.createElement("a");
                a.download = "download_img" + ".png";
                a.href = canvasdata;
                document.body.appendChild(a);
                a.click();
            };
            img.src = image64;
        }
            );

这是我的错误

标签: javascriptinternet-explorercanvasrendertodataurl

解决方案


推荐阅读