在amCharts Angular中的createChild上找不到html容器

问题描述

在这里，当我在同一页面中时，它会加载图表。但是当我单击另一个页面并再次进入此页面时，该图表未加载，并且显示为 html容器未找到在createChild

但是，如果我再次重新加载，则会显示相同的页面图表。

这是我的component.ts文件。

constructor(private titleService: Title,private zone: NgZone) {
}

ngOnInit() {
    this.zone.runOutsideAngular(() => {

          this.drawingChart();
    });
  }

drawingChart() {
    am4core.useTheme(am4themesAnimated);
    const container = am4core.create('div1',am4core.Container);
    container.width = am4core.percent(100);
    container.height = am4core.percent(100);
    const chart = container.createChild(am4charts.XYChart);
    chart.padding(0,0);

    chart.data = [
      {
        date: '2012-07-27',value: 13
      },{
        date: '2012-12-28',value: 50
      },{
        date: '2012-12-29',value: 51
      },{
        date: '2013-01-30',value: 81
      }];
    chart.colors.list = [
      am4core.color('rgba(4,69,142,1)'),];

    // Create axes
    const dateAxis = chart.xAxes.push(new am4charts.DateAxis());
    const valueAxis = chart.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 = chart.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;
  }

这是我的html文件

<div class="col-10 col-sm-3-2 col-md-3-2 col-lg-7-6">
  <div class="l-content-wrapper ">
    <div class="a-title">
      <div class="a-title-content">
        <div class="a-title-content-main">Chart</div>
      </div>
    </div>
    <div id="div1" class="graph_area graph_area__500">
    </div>
  </div>
</div>

我在这里找不到原因

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

amcharts4 angular