使用 Angular 和 Ionic 5 在 Highchart 外部创建导出按钮答案

【问题标题】：export button create outside Highchart using Angular and Ionic 5使用 Angular 和 Ionic 5 在 Highchart 外部创建导出按钮
【发布时间】：2020-04-08 19:39:45
【问题描述】：

我创建了 highchart，我尝试将导出按钮放在图表之外。但我没有进入离子角度框架。

我尝试在 SVG 中导出图表。我浏览了这个链接：http://jsfiddle.net/tLfeaL7y/ 在此导出为 javascript：代码：全选

 $('#export_JPG').click(function() {
    chart.exportChartLocal({
      type: 'image/jpeg'
    });
  });

如果有任何方法可以在 IONIC 5 和 Angular 中导出。

谢谢

【问题讨论】：

标签： angular ionic-framework highcharts ionic4 ionic5

【解决方案1】：

这是一个演示，展示了如何在 Angular 环境中创建自定义按钮来触发图表下载。

演示：https://codesandbox.io/s/angular-js9nk

  test = () => {
    console.log(this.Highcharts.charts)
    this.Highcharts.charts[0].exportChart({
      type: 'image/jpeg',
      filename: "line-chart"
    });
  }

API：https://api.highcharts.com/class-reference/Highcharts.Chart#exportChart

【讨论】：