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

Question

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

我尝试导出 SVG 图表。我经历了这个 link：http://jsfiddle.net/tLfeaL7y/ 在此导出为 javascript 时：代码：Select全部

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

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

谢谢

Answer 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

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

export button create outside Highchart using Angular and Ionic 5

angular

ionic-framework

highcharts

ionic4

ionic5