将 jqPlot 图保存到图像文件

Posted

技术标签:

【中文标题】将 jqPlot 图保存到图像文件【英文标题】:Saving a jqPlot graph to an image file 【发布时间】:2013-02-13 23:59:03 【问题描述】:

我正在使用 jqPlot 在某些网页上显示许多图表。我希望能够将这些图表保存到图像文件中。

最好的方法是什么?是否可以在图表上有一个右键菜单选项,可以将图表保存到图像文件中?

这是我的一张图表的一些代码:

var plotCogsLineGraph = $.jqplot('FinancialsLineGraph', [[30,31,34,40,45], [34,38,31,42,38]], 
 
            axes:
            
                xaxis:
                
                      ticks: ['5','4','3','2','1']
                ,
                yaxis:
                
                    label:'%',
                    pad: 1.05,
                    ticks: ['0','15','30','45','60']
                
            ,

            width: 480, height: 270,
            legend:show:true, location: 's', placement: 'insideGrid', renderer: $.jqplot.EnhancedLegendRenderer,
    seriesDefaults: 
    
                rendererOptions: smooth: true
    ,
    series:[ 
                
                    lineWidth:1, 
                    label:'COGS',
                    markerOptions:  size:1, style:'dimaond' 
                , 
                
                    lineWidth:1, 
                    label:'Wages',
                    markerOptions:  size: 1, style:"dimaond" 
                
                ]
    
); 

需要在上面的代码中添加什么才能将图形保存到图像文件中?

【问题讨论】:

【参考方案1】:

试试这个:

$('#FinancialsLineGraph').jqplotSaveImage()

【讨论】:

【参考方案2】:

假设您的绘图正在绘制一个具有“绘图”ID 的 div。 您必须应用本机 jqplotToImageStr() 函数才能将绘图转换为图像。 然后您可以填充另一个 div(例如 id = 'graphicImage')以显示这个新生成的图像:

var graphicImage = $('#graphicImage');
if(graphicImage.html() == "") //If the image was even generated, don't generate it again
  var divGraph = $('#plot').jqplotToImageStr();
  var divElem  = $('<img/>').attr('src', divGraph);
  graphicImage.html(divElem);

为了下载图像,您可以执行以下操作:

   open(divGraph.toDataURL("image/png"));

在我的情况下,它不能很好地工作,因为我电脑上下载的图像已损坏。 如果您找到保存它的方法,我会很高兴听到它。

无论如何,一旦你完成了这个答案的第一部分(用jqplot对应的图像填充'#graphicImage' div),你可以通过右键单击它来保存它......

【讨论】:

我在行出现错误:var divElem = $(').attr('src', divGraph); 引用没有围绕 标签结束 下载试试这个下载【参考方案3】:

$('#GraphName').jqplotSaveImage() 但请注意,如果您在刻度上应用了一些自定义样式,则不会将其保存到图像中

【讨论】:

以上是关于将 jqPlot 图保存到图像文件的主要内容,如果未能解决你的问题,请参考以下文章

C++如何把位图保存到数组中

将图像保存到文件目录

如何将上传的图像保存到 IndexedDB Javascript

将图像保存到文件系统

将图像保存到默认相机文件夹 - IOS

将图像保存到特定相册,但限制保存到相机胶卷文件夹