高图表中的树形图在angular5中不起作用

时间:2018-11-28 13:19:23

标签: highcharts angular5 treemap

我正试图在hight chart的帮助下创建树状图。

DashboardModule.ts

import { ChartModule, HIGHCHARTS_MODULES } from 'angular-highcharts';
import * as more from 'highcharts/highcharts-more.src';
import * as tree from 'highcharts/modules/treemap.src';
@NgModule({
  imports: [
   ChartModule
  ],
  providers: [
    { provide: HIGHCHARTS_MODULES, useFactory: () => [ more, tree ] } // add as factory to your providers
  ]
})
export class DashboardModule { }

Dashboard.component.ts

import { MapChart } from 'angular-highcharts';
export class DashboardComponent implements OnInit {
treeChart: any;
 ngOnInit() {
    this.treeChartStructure();
  }
  treeChartStructure() {
   this.treeChart = new MapChart({
    series: [{
      type: 'treemap',
      layoutAlgorithm: 'squarified',
      data: [{
          name: 'A',
          value: 6,
          colorValue: 1
      }, {
          name: 'E',
          value: 2,
          colorValue: 5
      }, {
          name: 'F',
          value: 2,
          colorValue: 6
      }, {
          name: 'G',
          value: 1,
          colorValue: 7
      }]
  }]
    });
  }
}
}

html

<div [chart]="treeChart"></div>

在上面的代码中,我试图将树形图添加到我的angular5应用程序中,但是它不起作用。它显示以下错误。 enter image description here 谁能帮我解决这个问题。

0 个答案:

没有答案