在chart.js中的x轴上显示最近3个月

时间:2017-10-20 10:18:54

标签: angular typescript chart.js

我正在使用Angular 4,chart.js,ng2-charts和chartjs-plugin-annotation处理项目。 我无法找到如何在x轴上显示从今天开始的最后3个月,这可能是mapjs-plugin-annotation的一种方式,但我无法解决它。

这是我的代码:

public lineChartData:Array<any> = [
    {data: [], label:'Series A'}
  ];
  public lineChartLabels:Array<any> = [];
  public lineChartOptions:any = {
    responsive: true,
    scales: {
            yAxes: [{
                ticks: {
                    beginAtZero: true
                }
            }]
        },
    annotation: {
        drawTime: 'beforeDatasetsDraw',
        annotations: [{
            type: 'box',
            id: 'a-box-1',
            yScaleID: 'y-axis-0',
            yMin: 0,
            yMax: 30,
            backgroundColor: '#f7d7db'
        }, {
            type: 'box',
            id: 'a-box-2',
            yScaleID: 'y-axis-0',
            yMin: 30,
            yMax: 70,
            backgroundColor: '#FFECD1'
        }, {
            type: 'box',
            id: 'a-box-3',
            yScaleID: 'y-axis-0',
            yMin: 70,
            yMax: 100,
            backgroundColor: '#e6f5f0'
        }]}
  };
  public lineChartColors:Array<any> = [
    { // grey
      backgroundColor: 'rgba(148,159,177,0.2)',
      borderColor: 'rgba(148,159,177,1)',
      pointBackgroundColor: 'rgba(148,159,177,1)',
      pointBorderColor: '#fff',
      pointHoverBackgroundColor: '#fff',
      pointHoverBorderColor: 'rgba(148,159,177,0.8)'
    }
  ];
  public lineChartLegend:boolean = false;
  public lineChartType:string = 'line';

0 个答案:

没有答案