ie下js将html转为图片格式,javascript – 在浏览器中将svg转换为png图像(包括IE在内的跨浏览器)...

我正在使用Highcharts,我需要将页面上的所有图表转换为我可以发送到我的服务器的图像,这样我就可以将它合并到主导出excel,它已经包含一些表格和透视网格.

到目前为止这是我的代码

var svg = Highcharts.getSVG(charts);

img = new Image();

img.src = "data:image/svg+xml," + encodeURIComponent(svg);

mycanvas = document.createElement('canvas');

mycanvas.width = 1000

mycanvas.height = 1000

ctx = mycanvas.getContext("2d");

ctx.drawImage(img, 0, 0);

$("body").append("");

$.ajax({

type: "POST",

url: '@Url.Action("getfile")',

data: JSON.stringify({ file: mycanvas.toDataURL("image/png").replace("data:image/png;base64,", "") }),

contentType: 'application/json; charset=utf-8'

});

这是我测试的c#代码,如果我从客户端正确获取数据(我只是将base64字符串写入文件). Firefox和Chrome正确写入图像,IE只给我一个黑色图像

public void getfile(string file)

{

System.IO.File.WriteAllBytes(@"c:\yourfile.png", Convert.FromBase64String(file));

}

图像似乎在Firefox和Chrome中生成,但不是IE(这里我只是得到一个黑色图像).我使用的画布从我收集的IE支持IE9 Support for HTML5 Canvas tag.

如果你能帮助我弄清楚我做错了什么,或者你可以指出更好的解决方案,我会非常感激.