ng2-charts更新标签上的图形

时间:2017-09-15 09:59:45

标签: typescript angular2-template angular2-services ng2-charts

我正在尝试更新标签级别的图形,我已经获得了数据。

我的问题是我的图表将日期作为标签。我设计了两个开始日期和结束日期字段,以便用户可以自定义图表并自动生成。

我的问题是我有字段barChartLabels这是一个字符串,它检索所选日期的范围,但是当范围扩展或减少时,它保持与第一次相同的值。

如果我每次查询数据范围时将标签置为null并重新生成它,我不知道解决方案是什么。或者,如果有任何方法可以生成与值一样多的标签恢复。

例如我有4个日期标签,我只显示3个数据,正确的是显示3个标签。

我的组件:

mostrarnombre(){
  this._invService.getinvfecha(this.fecha1,this.fecha2).subscribe(
      response => {
      if (!response) {
        console.log('error al cargar datos');
      } else {

        this.resultData = response;
        this.barChartLabels = this.resultData.map(item => item.fecha);

        var d0=this.resultData.map(item => item.sensorluz1);
        var d1=this.resultData.map(item => item.sensorluz2);
        var d2=this.resultData.map(item => item.sensorluz3);
        this.barChartData.push({data: d0, label: 'sensorluz1'});
        this.barChartData.push({data: d1, label: 'sensorluz2'});
        this.barChartData.push({data: d2, label: 'sensorluz3'});
        let clone = JSON.parse(JSON.stringify(this.barChartData));
        clone[0].data = d0;
        clone[1].data = d1;
        clone[2].data = d2;
        this.barChartData = clone;
        this.loaded = true;
      }
    },
    error =>{
      console.log(<any>error);
    }
  );

首先,我检索图中所示的4列:

getChildCount()

更新时,它只需要显示3列,并显示4列,因为它不会更新标签。如图所示。

我怎么能解决这个问题我不知道如何更新字段

this.barChartLabels = this.resultData.map (item => item.day);

这包含我的item.day:["2017-09-05T11: 15: 06.000Z", "2017-09-05T17: 22: 14.000Z", "2017-09-05T17: 22: 14.000Z", "2017- 09-12T12: 22: 00ZZ "]

Grafica4

非常感谢你的问候

1 个答案:

答案 0 :(得分:0)

我已经在第二个答案的合作伙伴的下一篇文章中找到了解决方案。

ng2-charts update labels and data

问候和运气。