javascript - 从 jQuery 流程图中打印出来

Question

我正在使用 jQuery flot 图表，并且想要打印图表(或至少是图像)。现在，在问这个问题之前，我做了很多研究来找到一种方法......并且我在堆栈溢出上提出了这个问题。

<强> How to print flot graph

我实现了那里给出的技术。

现在，我能够获取图表的图像，但无法获取图表的内容，即我只是获取 Canvas 的纯背景，而不是在其上绘制的区域。

下面的图片将清楚地解释这一点:

这就是我的图表的样子...

这就是我将其转换为图像后得到的结果:

我使用 ToDataUrl 进行转换，下面是我的代码:

  var somePlot = $.plot("#placeholder", [ [0,0],[10,10] ]);
  var canvas = somePlot.getCanvas();
  var img = canvas.toDataURL("image/png");
  document.write('<img src="'+img+'"/>');

在上面的代码中:

somePlot 变量用于获取 div 内的 Canvas ，因为 jquery flot 在 Canvas 内实现我无法实现的图形使用其 id 直接访问。

任何帮助将不胜感激，谢谢...

Answer 1

您不是将图形转换为图像，而是将一些测试图转换为空。看这个fiddle (上面的图是用绘图制作的，下面的图是图像)。

如果你修复你的测试数据，你会得到这个 fiddle ，它在绘图部分和图像中显示图形。修复此处的数据意味着插入更多括号:

var somePlot = $.plot("#placeholder", [ [ [0,0], [10,10] ] ]);

PS:我的测试不使用该插件将标签添加到 Canvas ，但从您的图像中我看到您已经正确地完成了该部分。