javascript - 在 IE 中单击按钮即可下载 Jqplot 图像

Question

我有 jqplot，我想在单击按钮后将其下载为 jpg 或 png 格式。我可以使用

$('#chartdiv').jqplotSaveImage();

(chartdiv是带有绘图的div)

它仅适用于 Chrome 和 Firefox。在 IE 中它不起作用。我在 IE 11 中尝试过。

我在 Chrome 中遇到另一个问题，下载的图像文件名为“download”，而在 Firefox 中，它是一些带有 .part 扩展名的有线名称(例如:- ka8ShgKH.part)。有没有办法将情节标题作为下载文件名？

谢谢。

$("#btnSaveImg").on("click", LoadImage);

LoadImage = function(){
    $('#chartdiv').jqplotSaveImage();
}

编辑jqplotsaveimage函数

$.fn.jqplotSaveImage = function() {
    var imgData = $(this).jqplotToImageStr({});
    if (imgData) {
        window.location.href = imgData.replace("image/png", "image/octet-stream");
    }

};

Answer 1

我正在使用 jqPlot，在 IE 中使用上述内容时遇到问题，即使它在 Chrome 中工作，我也无法命名下载的图像。

我发现了这个案例force download base64 image和 http://danml.com/download.html 。这在更高版本的 IE 和 Chrome 中都适用，您可以使用自己的文件名保存图像。 download.js 不仅仅可以用于图像。

//include the downoad.js file from http://danml.com/download.html

<button id="dwnl-chart-1" onClick="$.fn.jqplotSaveImage('chart-1', 'chart_name">Download as image</button>

    $.fn.jqplotSaveImage = function(id, filename) {

        var imgData = $('#'+id+'-parent').jqplotToImageStr({});
        if (imgData) {
            download(imgData, filename+'.png', "image/png");
        }
    };