[英]Unable to display the chart using Ionic3/2
Hi im trying to display the static data using the High charts and i am getting error 13 and i placed this 嗨,我尝试使用高位图表显示静态数据,但出现错误13,我将其放置在
<div id="container" style="display: block;" ></div>
in html file and below is the data i am using to display chart 在html文件中,下面是我用来显示图表的数据
import * as HighCharts from 'highcharts';
ionViewDidLoad(){
var myChart = HighCharts.chart('container', {
chart: {
type: 'bar'
},
title: {
text: 'Fruit Consumption'
},
xAxis: {
categories: ['Apples', 'Bananas', 'Oranges']
},
yAxis: {
title: {
text: 'Fruit eaten'
}
},
series: [{
name: 'Jane',
data: [1, 0, 4]
}, {
name: 'John',
data: [5, 7, 3]
}]
});
}
Is there any better charting library for ionic for displaying the charts other that chart.js 是否有更好的用于Ionic的图表库来显示除chart.js以外的图表
There is a package with angular2 named angular2-highcharts
有一个名为
angular2-highcharts
import { ChartModule } from 'angular2-highcharts';
and options as, 和选项,
class AppComponent {
constructor() {
this.options = {
chart: {
type: 'bar'
},
title: {
text: 'Fruit Consumption'
},
xAxis: {
categories: ['Apples', 'Bananas', 'Oranges']
},
yAxis: {
title: {
text: 'Fruit eaten'
}
},
series: [{
name: 'Jane',
data: [1, 0, 4]
}, {
name: 'John',
data: [5, 7, 3]
}]
};
}
options: Object;
}
Check official highcharts#typescript 查看官方highcharts#typescript
stackblitz demo stackblitz演示
import { Component, ViewChild, ElementRef } from '@angular/core';
import { NavController } from 'ionic-angular';
import Highcharts from 'highcharts';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage{
@ViewChild("container", { read: ElementRef }) container: ElementRef;
constructor(public navCtrl: NavController) {
}
ionViewDidLoad() {
Highcharts.chart(this.container.nativeElement, {
chart: {
type: 'bar'
},
title: {
text: 'Fruit Consumption'
},
xAxis: {
categories: ['Apples', 'Bananas', 'Oranges']
},
yAxis: {
title: {
text: 'Fruit eaten'
}
},
series: [{
name: 'Jane',
data: [1, 0, 4]
}, {
name: 'John',
data: [5, 7, 3]
}]
})
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.