highcharts error -13 в то время как графики были обработаны - PullRequest
Новая
       22

highcharts error -13 в то время как графики были обработаны

0 голосов
/ 03 июня 2019

Я использую высокие графики в своем угловом приложении.Несмотря на то, что мои графики отображаются при нагрузке, я все еще получаю высокие графики # error-13 в моей консоли.

Я вызываю метод моего рендеринга в хуке жизненного цикла ngOnInit.Я также добавил проверку, чтобы убедиться, что метод должен вызываться только после того, как данные станут доступны.

Мой HTML: <div [attr.id]="chartContainerID" class="chart-container mt-0"></div>

Мой TS-файл: 

export class MyComponent implements OnInit, {
  chartContainerId: string;

  constructor(private xrangechart: XrangeChartService, ) {
    if (!this.chartContainerId) {
    this.chartContainerId = String(Math.random());
  }}

  ngOnInit() {
    // to do call the service here.
    this.getData();
  }

  renderChart(chartOptions: any) {
    const chart = this.xrangechart.renderChart(this.chartContainerId, chartOptions);
    if (chart) {
       this.plotShapes(chart);
    }
 }
 getData() {
   this.dataservice.subscribe(data => {
    if (data !== null && data !== undefined &) {
      console.log(data);
      this.dataReturned = data;
      this.renderChart(this.setChartOptions());
    }
  });
}


  setChartOptions() {
    const chartOptions: any = {};
    // Setting chart height
    chartOptions.height = 300;
    // Setting the click event on the label
    chartOptions.data = this.dataReturned.data;
    // to set the yaxis
    chartOptions.yAxis = {
        gridLineWidth: chartContainer.gridLineWidth,
        margin: 0,
        title: {
            text: ''
        },
        categories: this.data.categories,
        reversed: true
      };
    return chartOptions;
  }


  plotShapes(chart: any) {
    // some logic to plot shape
}

}

Ожидается: ошибка в консоли не должна присутствовать, и диаграммы должны отображаться без ошибок

1 Ответ

0 голосов
/ 03 июня 2019

Эта ошибка возникает из-за того, что контейнер не найден там, где будет отображаться ваш график.например: 

<div [attr.id]="chartContainerID" class="chart-container mt-0"></div>

перед рендерингом диаграммы убедитесь, что у вашего div есть атрибут id.Вы должны вызвать метод визуализации диаграммы после того, как у вас div есть атрибут id.потому что в качестве исходного кода у вас есть динамический id в вашем div.

...