我使用基于on this project的ng2-chartjs2图表做了一个小的ionic2项目。我需要添加选项,而且没有关于如何添加选项的文档。这是my project repo
我的选项代码段。
options: Chart.Options[] = [{
responsive: true, //red squiggly line here
animation:false,
defaultFontColor:"#666"
}];
home.html的
<chart [labels]="labels" [data]="data" [options]="options" type="bar"></chart>
任何建议都会有所帮助。
答案 0 :(得分:2)
试试这个:
1)main.ts
export class MainPage {
options: any = {
type: 'doughnut',
data: {
labels: ["Restaurante", "Vestuário", "Lazer", "Eletrônico"],
datasets: [{
label: 'Dinheiro',
borderWidth: 0,
data: [12, 19, 3, 5],
backgroundColor: [
'#FDBC11',
'#ee4250',
'#02A4C0',
'#229f37'
],
}]
},
options: {
responsive: true,
legend: {
position: 'left',
labels: {
boxWidth: 20
}
}
}
};}
2)main.html
<chart [options]="options" ></chart>
这适合我。
答案 1 :(得分:0)
在codebase定义的Chart.Options的结构是
export interface Options {
type: Type;
data: {
labels: string[];
datasets: Dataset[];
};
options?: {
tooltips?: {
custom?: Function;
};
legend?: LegendConfiguration;
scales?: {
yAxes?: Array<{ticks?: {beginAtZero: boolean}}>
};
responsive?: boolean;
responsiveAnimationDuration?: number;
maintainAspectRation?: boolean;
events?: string[];
onClick?: Function;
legendCallback?: Function;
onResize?: Function;
title?: TitleConfiguration;
hover?: HoverConfiguration;
pan?: {
enabled?: boolean;
mode?: string;
},
zoom?: {
enabled?: boolean;
mode?: string;
}
};
}
将选项的结构更改为上述格式,以避免编译错误。
options: Chart.Options = {
type: , // type of the chart -- mandatory
data: {}, // mandatory
options: { //optional
responsive: true,
responsiveAnimationDuration: 0
}
}