2

我正在使用 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" }
                }
                ]
    }
);

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

4

3 回答 3

8

尝试这个：

$('#FinancialsLineGraph').jqplotSaveImage()
于 2013-08-01T07:11:28.690 回答
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），你可以通过右键单击它来保存它......

于 2013-02-14T07:33:47.157 回答
1

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

于 2016-09-28T07:11:55.583 回答