Error: “Chart is unknown chart type”

[beabri]

trafficstars

When I try to load a simple highchart in my Angular 2 app, it always gives me the following error:

Here my app.module.ts:

import { ChartModule } from 'angular2-highcharts';

@NgModule({
  imports: [
    ChartModule.forRoot('highcharts')
  ]
})
export class AppModule {
}

My sistemjs.config.js:

    map: {
        'angular2-highcharts': 'npm:angular2-highcharts',
        'highcharts': 'npm:highcharts'
    },
    packages: {
        highcharts: {
            main: './highcharts.js',
            defaultExtension: 'js'
        },
        'angular2-highcharts': {
            main: './index.js',
            defaultExtension: 'js'
        }            
    }

And, inside my component:

import { Component } from '@angular/core';
import { ChartModule } from 'angular2-highcharts';

@Component({
  selector: 'highchart',
  template: '<chart [options]="options">'
})

constructor() {
    this.options = {
        title : { text : 'angular2-highcharts example' },
        series: [{
            name: 's1',
            data: [2,3,5,8,13],
            allowPointSelect: true
        },{
            name: 's2',
            data: [-2,-3,-5,-8,-13],
            allowPointSelect: true
        }]
    };

    console.log(this.options);
} 
options: Object;

[rupalpatel0008]

I also had same issue in my ionic 2 app. I used

ChartModule.forRoot(require('highcharts'))

instead of ChartModule.forRoot('highcharts') and it worked!

[Robouste]

I have the same problem and I use forRoot(require('highcharts'))

I tried setting the type in the options object but without success

  this.options = {
         chart: { 
             type: 'spline'
         },
         title : {
             text: 'testing chart'
         },
         series: [{
             data: [29.9, 71.5, 106.4, 129.2]
         }]
     };