2017-08-01 68 views
0

我想加上我的項目highchart計,但我給離子2未捕獲的(在承諾):錯誤:Highcharts錯誤#17:www.highcharts.com/errors/17

Uncaught (in promise): Error: Highcharts error #17: www.highcharts.com/errors/17 error

它說我 ;加載highcharts-more.js文件,但我不知道我怎麼可以加載

我搜查,但我不能找到任何

感謝名單到現在

app.module.ts

import { NgModule, ErrorHandler } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular'; 
import { MyApp } from './app.component'; 

import { KanalolusturPage } from '../pages/kanalolustur/kanalolustur'; 
import { KanalPage } from '../pages/kanallistele/kanallistele'; 
import { TabsPage } from '../pages/tabs/tabs'; 

import { StatusBar } from '@ionic-native/status-bar'; 
import { SplashScreen } from '@ionic-native/splash-screen'; 
import { DbProvider } from '../providers/db/db'; 
import { IonicStorageModule } from '@ionic/storage'; 
import { HttpModule } from '@angular/http'; 
import { SQLitePorter } from '@ionic-native/sqlite-porter'; 
import { SQLite } from '@ionic-native/sqlite'; 
import { TaskServiceProvider } from '../providers/task-service/task-service'; 
import { ChartModule } from 'angular2-highcharts'; 
import * as highcharts from 'Highcharts'; 



@NgModule({ 
    declarations: [ 
    MyApp, 
    KanalolusturPage, 
    KanalPage, 
    TabsPage, 
    GetlerPage, 
    PostlarPage, 
    UyelikPage, 
    ElementolusturPage, 
    VerilerPage, 
    ], 
    imports: [ 
    BrowserModule, 
    HttpModule, 
    IonicModule.forRoot(MyApp), 
    IonicStorageModule.forRoot(), 
    ChartModule.forRoot(highcharts) 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
    MyApp, 
    KanalolusturPage, 
    KanalPage, 
    TabsPage, 
    GetlerPage, 
    PostlarPage, 
    UyelikPage, 
    ElementolusturPage, 
    VerilerPage, 

    ], 
    providers: [ 
    StatusBar, 
    SplashScreen, 
    {provide: ErrorHandler, useClass: IonicErrorHandler}, 
    DbProvider, 
    DbProvider, 
    SQLitePorter, 
    SQLite, 
    TaskServiceProvider, 
    ] 
}) 
export class AppModule {} 

veriler.ts

constructor(public navCtrl: NavController, public navParams: NavParams,public http: Http) { 


    this.chartOptions={ 
     chart: { 
    type: 'gauge', 
    plotBackgroundColor: null, 
    plotBackgroundImage: null, 
    plotBorderWidth: 0, 
    plotShadow: false 
}, 

title: { 
    text: 'Speedometer' 
}, 

pane: { 
    startAngle: -150, 
    endAngle: 150, 
    background: [{ 
     backgroundColor: { 
      linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 }, 
      stops: [ 
       [0, '#FFF'], 
       [1, '#333'] 
      ] 
     }, 
     borderWidth: 0, 
     outerRadius: '109%' 
    }, { 
     backgroundColor: { 
      linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 }, 
      stops: [ 
       [0, '#333'], 
       [1, '#FFF'] 
      ] 
     }, 
     borderWidth: 1, 
     outerRadius: '107%' 
    }, { 
     // default background 
    }, { 
     backgroundColor: '#DDD', 
     borderWidth: 0, 
     outerRadius: '105%', 
     innerRadius: '103%' 
    }] 
}, 

// the value axis 
yAxis: { 
    min: 0, 
    max: 200, 

    minorTickInterval: 'auto', 
    minorTickWidth: 1, 
    minorTickLength: 10, 
    minorTickPosition: 'inside', 
    minorTickColor: '#666', 

    tickPixelInterval: 30, 
    tickWidth: 2, 
    tickPosition: 'inside', 
    tickLength: 10, 
    tickColor: '#666', 
    labels: { 
     step: 2, 
     rotation: 'auto' 
    }, 
    title: { 
     text: 'km/h' 
    }, 
    plotBands: [{ 
     from: 0, 
     to: 120, 
     color: '#55BF3B' // green 
    }, { 
     from: 120, 
     to: 160, 
     color: '#DDDF0D' // yellow 
    }, { 
     from: 160, 
     to: 200, 
     color: '#DF5353' // red 
    }] 
}, 

series: [{ 
    name: 'Speed', 
    data: [80], 
    tooltip: { 
     valueSuffix: ' km/h' 
    } 
}] 

    }; 

veriler.html

<chart class="my-gauge-chart" [options]="chartOptions" type="chart" ></chart> 

而且你可以幫助這個帖子ionic 2 google charts Uncaught TypeError: (void 0) is not a function

+0

錯誤的開始是'發生此錯誤時,您將chart.type或series.type設置爲Highcharts中未定義的系列類型。你確定你沒有設置一些奇怪的類型嗎? – Axnyff

+0

我添加了新的代碼塊,並且我提取了chartOptions代碼這個地址 https://www.highcharts.com/demo/gauge-speedometer –

回答

1

事端類似於:

import Highmore from '../../node_modules/highcharts/highcharts-more.js'; 

,並可能this

npm install highcharts-more --save 
+0

我在veriler.ts和app.module.ts上添加了同樣的錯誤 –

+0

Thanx bro,I解決了;添加ChartModule.forRoot(highcharts,Highmore) –

相關問題