Question

我使用HighCharts的AngularJS应用程序（但不是highcharts-ng）。我实现了类似于此JSFiddle的导出功能，该功能来自此GitHub discussion。

问题是，加载后，导出只运行一次。对于后续导出，它会抛出错误TypeError: Cannot read property 'exporting' of undefined。

有趣的是，在JSFiddle和我的实现中都可以看到相同的行为。

我认为它指的是图表选项的导出属性。为什么在一次导出后选项会变得不确定？

Answer 1

exportChart()方法丢失了它应该是图表的上下文，但实际上在第一次导出后，上下文是一个没有属性的已删除图表 - 所以它没有任何选项。

加载图表时，会调用回调

func: function (chart) {
           $scope.chartExport = $.proxy(chart.exportChart, chart);
         }

在上面的回调chartExport()中，上下文与渲染图表绑定 - 这对于第一次导出是合适的。

当第一次导出正在进行时，会创建一个新的临时图表，其中新选项与原始图表中的选项合并。来自chartConfig的回调再次被调用，现在$scope.chartExport()与临时图表绑定，临时图表将在导出完成后被销毁。

将回调移至加载事件，并在导出选项中覆盖它，以便它不会更改chartExport()上下文。

options: {
        chart: {
            type: 'bar',
            events: {
                load: function () {
                 $scope.chartExport = $.proxy(this.exportChart, this);
              }
            }
        }
    },

...

$scope.svgExport = function() {
    $scope.chartExport({type: 'image/svg+xml', filename: 'my-svg'}, {
        chart: {events: {load: function () {} }},
      subtitle: {text:''}});
}

示例：http://jsfiddle.net/a9cse5pt/18/

Highcharts出口在首次出口后停止工作

1 个答案: