固定式高图图表与角度4集成

时间:2017-07-21 21:20:41

标签: git angular charts gauge

我正在尝试将角度4与高图进行整合。我能够获得像条形图等简单的图表。但是当试图实现固体测量得到以下错误时:

ERROR Error: Highcharts error #17: www.highcharts.com/errors/17
    at Object.a.error (highcharts.js:10)
    at a.Chart.initSeries (highcharts.js:248)
    at highcharts.js:271
    at Array.forEach (<anonymous>)

As per suggesions in other posts I have added the below code in appmodule.ts

    declare var require: any;
    export function highchartsFactory() {

        var hc = require('highcharts');
        var hcm = require('highcharts/highcharts-more');
        var sg = require('highcharts/modules/solid-gauge');

        hcm(hc);
        sg(hc);

        return hc;
    }


    @NgModule({
      declarations: [...],
      imports: [
     .....
        ChartModule
      ],
      providers: [ {provide: HighchartsStatic,useFactory: highchartsFactory}],
      bootstrap: [AppComponent]
    })
    export class AppModule { 
}

Git Hub存储库网址:https://github.com/AbhishekKaura25/solid-guage-demo

1 个答案:

答案 0 :(得分:0)

这是angular2-highcharts的官方示例,对我来说效果很好。

plnkr.co/edit/tLK6seWvqYBAl3QA7ayF?p=preview

我遇到了同样的问题和非常相似的错误消息,只需将您的代码更改为以下作品。

declare var require: any;

@NgModule({
  declarations: [...],
  imports: [
 .....
    ChartModule.forRoot(
      require('highcharts'),
      require('highcharts/modules/exporting'),
      require('highcharts/highcharts-more'),
      require('highcharts/modules/solid-gauge')
    )
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {