ng2-chartjs2 Ionic 2 Как добавить опции

Question

Я сделал небольшой проект ionic2 с диаграммами ng2-chartjs2 на основе on this project. Мне нужно добавить опции, и нет документации о том, как ее добавить. здесь 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> 

Любые советы будут полезны.

Answer 1

Попробуйте это:

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>

Это работает для меня.

Answer 2

Структура Chart.Options, как это определено в codebase является

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 
    } 
}