0

我正在使用Flotr2库在网页页面上呈现图表和图形。

我面临的问题是下载图表作为图像选项在最新的 chrome 浏览器上不起作用，我尝试调试问题并发现下面给出的作为 Flotr2 一部分的代码不起作用。

现场演示： 链接 （在最新的 chrome 浏览器中打开上面的链接并尝试点击“下载”按钮）

Flotr.addPlugin('download', {

  saveImage: function (type, width, height, replaceCanvas) {
    var
      grid = this.options.grid,
      image;

    if (Flotr.isIE && Flotr.isIE < 9) {
      image = '<html><body>'+this.canvas.firstChild.innerHTML+'</body></html>';
      return window.open().document.write(image);
    }

    if (type !== 'jpeg' && type !== 'png') return;

    image = getImage(
      type, this.canvas, this.ctx,
      this.canvasWidth, this.canvasHeight,
      grid && grid.backgroundColor || '#ffffff'
    );

    if (_.isElement(image) && replaceCanvas) {
      this.download.restoreCanvas();
      D.hide(this.canvas);
      D.hide(this.overlay);
      D.setStyles({position: 'absolute'});
      D.insert(this.el, image);
      this.saveImageElement = image;
    } else {
      var u = navigator.userAgent, isIE = (Flotr.isIE || (new RegExp(/(trident).+rv[:\s]([\w\.]+).+like\sgecko/i)).test(u) || (new RegExp(/(edge)\/((\d+)?[\w\.]+)/i)).test(u));

      if (isIE) {
          return window.open('about:blank').document.body.innerHTML = '<img src="' + image.src+ '">';
      }

      return window.open(image.src);
    }
  },

这里， 在此处输入图像描述

window.open(image.src)

在 Chrome v.61 中打开新标签窗口，但其中不显示任何图像，它是空白页。

注意：相同的功能适用于最新的 Firefox v.56

请建议。

4

1 回答 1

0

为什么不使用可以先打开的某种 preview.html 文件，然后在该页面中调用 js 函数（将 src 属性作为参数）以在页面上插入图像？

像这样：

预览.html：

<!doctype html>

<head>
<script>
function insertImage(dataurl)
{
    document.getElementById("previewImage").src = dataurl;
}
</script>
</head>
<body>
    <img id="previewImage" alt="awesome chart" />
</body>

</html>

称呼：

var win = window.open("preview.html");
win.insertImage(image.src);
于 2017-10-12T11:25:39.497 回答