javascript - Dygraphs 导出图像 createCanvas 不是函数

Question

我一直在尝试按照此 example 实现图表图像的导出，我一直遇到 Dygraph.createCanvas is not a function 错误。

下载了上一个链接的本地副本并使其工作正常，然后尝试将链接更改为 Dygraphs 库

<script type="text/javascript" src="http://dygraphs.com/dygraph-dev.js"></script>

至

<script type="text/javascript" src="http://dygraphs.com/2.0.0/dygraph.js"></script>

如我的应用程序中所使用的，然后抛出 Dygraph.createCanvas 不再是一个函数。

我缺少什么，该函数似乎存在于库中，为什么代码看不到它？

Answer 1

我也遇到了同样的问题。我为它创建了一个jsfiddle: https://jsfiddle.net/n3kozcu1/1/

 function export_chart() {
        var img = document.getElementById('demoimg')
        Dygraph.Export.asPNG(g, img);
 }

$("#button").click(export_chart);

fiddle 看起来有点奇怪，因为 dygraph-export 似乎不在任何地方的 CDN 上，所以我不得不将其全部粘贴进去。但是，我链接到了它的上游，所以你可以看到我没有使用旧版本。

super 简单的示例，与演示站点相同。这不起作用。失败:

“未捕获类型错误:Dygraph.createCanvas 不是函数”

编辑:因此，查看 dygraph-utils 代码: https://github.com/danvk/dygraphs/blob/aaec6de56dba8ed712fd7b9d949de47b46a76ccd/src/dygraph-utils.js

Dygraphs.createCanvas 只是一个创建 Canvas 的衬垫。因此，我将 dygraphs-export 中的相关行更改为:

canvas = document.createElement('canvas');

它成功了，但是在调用 Dygraph.update 的下一行中失败了。所以，我发现了这一点并将其修补到 Dygraph.Export

Dygraph.Export.hack_update =  function(self, o) {
  if (typeof(o) != 'undefined' && o !== null) {
    for (var k in o) {
      if (o.hasOwnProperty(k)) {
        self[k] = o[k];
      }
    }
  }
  return self;
};


Dygraph.Export.asCanvas = function (dygraph, userOptions) {
    "use strict";
    var options = {}, 
    canvas = document.createElement('canvas');

    Dygraph.Export.hack_update(options, Dygraph.Export.DEFAULT_ATTRS);
    Dygraph.Export.hack_update(options, userOptions);

    canvas.width = dygraph.width_;
    canvas.height = dygraph.height_ + options.legendHeight;

    Dygraph.Export.drawPlot(canvas, dygraph, options);    
    Dygraph.Export.drawLegend(canvas, dygraph, options);

    return canvas;
};

这“有效”。我说“适用于”引号是因为它仍然存在问题，例如正确打印轴标签并且它不适用于 HiDPI 显示器，但它至少不会崩溃。