在移动设备上触摸图表时出现 AnyChart 'undefined is not an object' 错误

如何解决在移动设备上触摸图表时出现 AnyChart 'undefined is not an object' 错误

使用正在查看 AnyChart 图表的移动设备时，当您触摸图表时，会抛出“未定义不是对象”错误。这发生在 iOS 上。任何人都对导致此问题的原因以及如何解决此问题有任何想法？我使用的是最新版本 8.9.0

我在 Chrome 浏览器上使用 iOS 14.4.2，但在使用 Safari 时也会发生同样的情况。

以下是生成图表的基本代码：

this.chart = anychart.stock();

var credits = this.chart.credits();
credits.enabled(false);

this.plot = this.chart.plot(0);
this.plot.yScale().ticks().allowFractional(false);
this.plot.yScale().maximumGap(0);
this.plot.yScale().minimumGap(0);

let activeSeries = this.seriesTypeOptions.find(opt => opt.checked);
if (this.selectedRange === 'intra' && activeSeries.ohlc !== undefined) {
  activeSeries = this.seriesTypeOptions.find(opt => opt.value === 'area');
}
let data = activeSeries.ohlc ? this.ohlcMapping : this.valueMapping;
this.series = this.plot[activeSeries.value](data); 
this.series.name(this.longName + ' (' + this.symbol + ')');
if (this.mainColor && this.mainColor !== '') {
  this.series.stroke(this.mainColor);
  this.series.fill(this.mainColor,0.5);
}

let grouping = this.chart.grouping();

grouping.maxVisiblePoints(700);

if (this.selectedRange !== 'intra') {
  switch (this.groupOptions) {
    case 'day': {
      grouping.levels([
        { unit: 'day',count: 1 },]);
      grouping.forced(true);
      break;
    }
    case 'week': {
      grouping.levels([
        { unit: 'week',]);
      grouping.forced(true);
      break;
    }
    case 'month': {
      grouping.levels([
        { unit: 'month',]);
      grouping.forced(true);
      break;
    }
    default: {
      break;
    }
  }
}

this.plot.legend().titleFormat('');
this.plot.yAxis().labels().format("{%value}{decimalsCount:0,groupsSeparator:}");

this.plot.crosshair().yLabel().offsetX(-24);
this.plot.xAxis().labels(true);
this.plot.xAxis().minorLabels(true);
this.plot.xAxis().ticks(true);
this.plot.xAxis().minorTicks(true);

this.plot.yGrid().enabled(true);

if (!this.isIndex) {
  let volPlot = this.chart.plot(1);
  volPlot.legend().titleFormat('');
  let volumeSeries = volPlot.column(this.volumeMapping); 
  volumeSeries.name('Volume ' + ' (' + this.symbol + ')');
  volPlot.crosshair().yLabel().offsetX(-24);
  volPlot.height('25%'); 
  volPlot.xAxis().labels(false);
  volPlot.xAxis().minorLabels(false);
  volPlot.xAxis().ticks(false);
  volPlot.yGrid().enabled(true);

  if (this.mainColor && this.mainColor !== '') {
    volumeSeries.stroke(this.mainColor);
    volumeSeries.fill(this.mainColor,0.5);
  }

  volPlot.yAxis().labels().format("{%value}{decimalsCount:1,scale: (1)(1000)(1000)(1000)|()(K)(M)(B)}");
  volPlot.enabled(this.isVolume);
}

//  add indicators
if (this.selectedRange !== 'intra') {
  let ind = this.indicatorOptions.filter(o => o.checked);
  ind.forEach(i => this.addIndicator(i.type));
}

var scroller = this.chart.scroller();
scroller.area(this.scrollMapping);
scroller.listen('scrollerchange',() => {
  let mv = this.chart.getSelectedRange();
  this.rangeStartDate = new Date(mv.firstVisible);
  this.rangeStopDate = new Date(mv.lastVisible);
});
scroller.enabled(this.isScroller);

let offSet: number = (this.isInfo) ? 425 : 275;
if (this.container !== undefined) {
  this.container.nativeElement.style.height = (window.innerHeight - offSet) + 'px';
  this.chart.container(this.container.nativeElement);
}

//  draw chart
this.chart.draw();

解决方法

如果有人遇到同样的问题。 忽略移动设备上图表抛出的异常。这解决了我的问题。