Ionic 2 Highcharts

Roy*_*yce 4 highcharts ionic-framework highcharts-ng ionic2 angular

我正在使用Ionic 2框架并希望实现highcharts.

我按照 mharington(离子团队)的步骤https://forum.ionicframework.com/t/ionic-2-and-highcharts-modules/59365/2来设置我的第一张高图.

我得到的错误是我无法导入它但我安装了节点模块

错误

在此输入图像描述

 angular2-highcharts include in my node_modules
Run Code Online (Sandbox Code Playgroud)

请帮忙

Iva*_*ers 7

你可能正在使用角度2 RC.mharrington的答案是关于离子beta.37(我猜),它使用角度2的beta版本.

它已更新至ChartModule现在.请参阅下文或查看github及其演示(plnkr)

正如angular2-highcharts所解释的那样:

在你的@ngModule申报文件中(概率app.module.ts)

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { ChartModule } from 'angular2-highcharts';
import { App } from './App';

@NgModule({
    imports: [BrowserModule, ChartModule],
    declarations: [App],
    bootstrap: [App]
})
export class AppModule {}
Run Code Online (Sandbox Code Playgroud)

在你的班上:

import { Component } from '@angular/core';

@Component({
    selector: 'simple-chart-example',
    template: `
        <chart [options]="options"></chart>
    `
})
export class App {
    constructor() {
        this.options = {
            title : { text : 'simple chart' },
            series: [{
                data: [29.9, 71.5, 106.4, 129.2],
            }]
        };
    }
    options: HighchartsOptions;
}
Run Code Online (Sandbox Code Playgroud)

此外,根据您使用的版本,您可能需要更改导入

import { ChartModule } from 'ng2-charts';

import { ChartModule } from 'ng2-charts/components/charts/charts';

因为这个问题(#440)

并记住,文档可能已过时,具体取决于版本,如果绑定[datasets]失败,则绑定到[data]源:ng2-charts - 无法绑定到"数据集",因为它不是"基础图表"的已知属性