Как вызвать общий метод для рисования диаграммы внутри ngAfterViewInit () в Angular amCharts - PullRequest
Новая
       1

Как вызвать общий метод для рисования диаграммы внутри ngAfterViewInit () в Angular amCharts

0 голосов
/ 01 апреля 2020

Здесь я создал отдельный общий метод для создания диаграмм, поскольку я хочу нарисовать несколько общих диаграмм, данные которых поступают из разных API. Я хочу вызвать это внутри ngAfterViewInit(). Вот мой общий метод. 

createChips(modules, chartNameChartTTV: am4charts.XYChart, divName: string, chartDataInfo: any[], chartValue: any, chartDate: any) {
    const am4core = modules[0];
    const am4charts = modules[1];
    const am4themesAnimated = modules[2].default;
    am4core.useTheme(am4themesAnimated);
    // DashboardComponent.disposeCharts([this.modificationsChartTTC, this.checkingsChartTTV, this.bookingsChartTTV]);
    chartNameChartTTV = am4core.create('divName', am4charts.XYChart);
    // const container = am4core.create('line_chart2', am4core.Container);
    chartNameChartTTV.width = am4core.percent(100);
    chartNameChartTTV.height = am4core.percent(100);
    // const chart = container.createChild(am4charts.XYChart);
    chartNameChartTTV.padding(0, 0, 0, 0);
    chartNameChartTTV.data = [];

    for (let i = 0; i < chartDataInfo.length; i++) {
      chartNameChartTTV.data.push({date: chartDate , value: chartValue});
      // console.log(chart);
    }

    chartNameChartTTV.colors.list = [
      am4core.color('rgba(4, 69, 142, 1)'),
    ];

    // Create axes
    const dateAxis = chartNameChartTTV.xAxes.push(new am4charts.DateAxis());
    const valueAxis = chartNameChartTTV.yAxes.push(new am4charts.ValueAxis());

    valueAxis.renderer.grid.template.disabled = true;
    valueAxis.renderer.labels.template.disabled = true;
    dateAxis.renderer.grid.template.disabled = true;
    dateAxis.renderer.labels.template.disabled = true;

// Create series
    const series = chartNameChartTTV.series.push(new am4charts.LineSeries());
    series.dataFields.valueY = 'value';
    series.dataFields.dateX = 'date';
    series.tooltipText = '{value';
    series.fillOpacity = 1;
    series.strokeWidth = 2;
    series.minBulletDistance = 15;
    // });
  }

Я хочу вызвать это внутри ngAfterViewInit() 

ngAfterViewInit() {
   this.zone.runOutsideAngular(() => {
      Promise.all([
        import('@amcharts/amcharts4/core'),
        import('@amcharts/amcharts4/charts'),
        import('@amcharts/amcharts4/themes/animated'),
        import('@amcharts/amcharts4/maps'),
        import('@amcharts/amcharts4-geodata/worldLow')
      ])
        .then(modules => {

           this.cardCheckingsChart(modules);
           this.createChips(modules, chartNameChartTTV: am4charts.XYChart, divName: string, chartDataInfo: any[], chartValue: any, chartDate: any);
          // this.cardRevenueChart(modules);
          this.createDemandCurve(modules);
          this.createMapChart(modules);
        })
        .catch(e => {
          console.error('Error when creating chart', e);
        });
    });
    this.getTopHotelInfo();
    this.getCheckingInfo();
    this.getRevenueInfo();
  }

Но это показывает ошибку. Как я могу использовать this.createChips(modules, chartNameChartTTV: am4charts.XYChart, divName: string, chartDataInfo: any[], chartValue: any, chartDate: any); этот общий метод внутри ngAfterViewInit ().

...