import { Component, OnInit, Input } from '@angular/core';
import { Label, Color } from 'ng2-charts';
import { ChartDataSets, ChartOptions } from 'chart.js';

@Component({
  selector: 'app-polar-chart',
  templateUrl: './polar-chart.component.html',
  styleUrls: ['./polar-chart.component.scss']
})
export class PolarChartComponent implements OnInit {

  @Input() public polarChartData: ChartDataSets;
  @Input() public polarChartOptions: ChartOptions;
  @Input() public polarChartTitle: string;
  @Input() public polarChartLabels: Label[];
  @Input() public polarChartColors: Color[] = [
    { // light-blue
      backgroundColor: '#3c8dbc',
      borderColor: '#3c8dbc',
      pointBackgroundColor: '#3c8dbc',
      pointBorderColor: '#fff',
      pointHoverBackgroundColor: '#fff',
      pointHoverBorderColor: '#3c8dbc'
    },
    { // orange
      backgroundColor: '#00a65a',
      borderColor: '#00a65a',
      pointBackgroundColor: '#00a65a',
      pointBorderColor: '#fff',
      pointHoverBackgroundColor: '#fff',
      pointHoverBorderColor: '#00a65a'
    },
    { // red
      backgroundColor: '#f56954',
      borderColor: '#f56954',
      pointBackgroundColor: '#f56954',
      pointBorderColor: '#fff',
      pointHoverBackgroundColor: '#fff',
      pointHoverBorderColor: '#f56954'
    }
  ];
  @Input() public polarChartLegend = true;
  @Input() public polarChartType = 'polarArea';
  @Input() public polarChartPlugins = [];



  constructor() { }

  ngOnInit() {
  }

}
