如何在Android上导出Highstock / Highcharts图表()

五陵年少金市东,银鞍白马渡春风。这篇文章主要讲述如何在Android上导出Highstock / Highcharts图表?相关的知识,希望能为你提供帮助。
我使用Highstock构建了一个图表,它在Chrome中正常运行。我可以导出通常在Chrome中生成的图表。但是当我在android上测试时,“图表导出”不起作用。该图表不会像在Chrome中一样导出。通过Android上安装的应用程序,图表可以正常运行。当我尝试在Android上导出图表时,没有任何反应。在Chrome for Android中使用远程调试并单击导出按钮会显示以下错误:

【如何在Android上导出Highstock / Highcharts图表()】[干预]忽略尝试取消具有cancelable = false的touchstart事件,例如因为滚动正在进行且无法中断。
如何在Android上导出Highstock / Highcharts图表()

文章图片

我怎么解决这个问题?
已经在Android Highcharts库上测试过,它也没有用。我制作了导出设置,如下视频所示:https://www.youtube.com/watch?v=feoZdOYBiF0
我使用Ionic 3和Angular 5,这是我的代码:
App.module.ts
import { ChartModule, HIGHCHARTS_MODULES} from 'angular-highcharts'; import exporting from 'highcharts/modules/exporting.src.js'; import * as Highcharts from 'highcharts'; import highcharts from 'angular-highcharts/highcharts'; import stock from 'highcharts/modules/stock.src'; import more from 'highcharts/highcharts-more.src'; export function highchartsModules(){ return [exporting, stock, more ]; }Highcharts.setOptions({ global: { useUTC: false }, lang: { months: [ 'Janeiro', 'Fevereiro', 'Mar?o', 'Abril', 'Maio', 'Junho', 'Julho', 'Agosto', 'Setembro', 'Outubro', 'Novembro', 'Dezembro' ], weekdays: [ 'Domingo', 'Segunda-Feira', 'Ter?a-Feira', 'Quarta-Feira', 'Quinta-Feira', 'Sexta-Feira', 'Sábado' ], shortMonths: [ "Jan" , "Fev" , "Mar" , "Abr" , "Mai" , "Jun" , "Jul" , "Aug" , "Set" , "Out" , "Nov" , "Dez"] }}); @NgModule({ declarations: [ ... ], imports: [ ChartModule ], bootstrap: [IonicApp], entryComponents: [...], providers: [ {provide: HIGHCHARTS_MODULES, useFactory: highchartsModules}, ] }) export class AppModule { }

page.html中
< ion-content> < div [chart]="stock" style="height: 510px; min-width: 310px"> < /div> < ion-content>

Page.ts
import { Chart } from 'angular-highcharts'; import * as Highcharts from "highcharts/highstock"; import { StockChart } from 'angular-highcharts'; @IonicPage() @Component({ selector: 'page-about', templateUrl: 'about.html' }) export class AboutPage { stock: StockChart; @ViewChild('content') content: ElementRef; constructor(...) {...this.humorList$.subscribe(items => { this.stock = new StockChart({ rangeSelector: { selected : 1, enabled:true },chart: { type: 'spline', }, exporting: { dateFormat:"%d-%m-%Y", chartOptions: { plotOptions: { series: { dataLabels: { enabled: true } } } }, fallbackToExportServer: false }, credits: { enabled: false }, title: { text: undefined }, plotOptions: { series: { color: '#009c58', }, spline: { marker: { enabled: true, fillColor: '#FFFFFF', lineWidth: 2, lineColor: null } } }, xAxis: { type: 'datetime', labels: { overflow: 'justify' }, scrollbar: { enabled: false } }, yAxis: { opposite: true, min: 0, max: 9, type: "category", categories: [...], labels: { reserveSpace: false, style: { fontSize: '10px', opacity: 0.55 } }, title: { text: undefined }, minorGridLineWidth: null, alternateGridColor: '#dff9ce', gridLineColor: '#a0d87c', gridLineWidth: 0.5 }, series: [{ name: 'Humor', data: [...] }],}); }); }

有人可以帮帮我吗?如果可能的话,我想看一个代码示例。
答案据我所知,图表不会在角度嵌入渲染引擎中渲染。我建议使用adb来远程调试你的应用程序。记录消息可能正在呈现给控制台。

    推荐阅读