Ionic图表（饼状图等）的使用
一、html核心代码
"""
……
<ion-content padding>
<div style="display: block;">
<canvas baseChart
[data]="doughnutChartData"
[labels]="doughnutChartLabels"
[chartType]="doughnutChartType"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)">
</canvas>
</div>
</ion-content>
"""
二、TS核心代码
（可优化，核心是变量的初始化再赋值）
"""
……
// Doughnut
public doughnutChartType:string = 'doughnut';
public doughnutChartLabels:string[] = [this.get_label('label1'), this.get_label('label2'), this.get_label('label3'), this.get_label('label4'), this.get_label('label5')];
public doughnutChartData:number[] = [this.get_number('data1'), this.get_number('data2'), this.get_number('data3'), this.get_number('data4'), this.get_number('data5')];
……
页面每次加载后，更新doughnutChartData的数据
……
get_number(data: string): number{
return Number(localStorage.getItem(data));
}
get_label(data: string): string{
return localStorage.getItem(data).toString();
}
……
"""
其实还是很好实现的，折腾了好几天的原因是：
1. 没有关注到变量的初始化（细节）
2. 对Angular语法不够了解（概念）
3.对报错未定位到某一行（调试技巧）
4. 对于参考代码中，对方未给全的地方，自己没想办法补上。
最后效果如图（点击日统计、周统计、月统计、年统计会自动更新图表）。