Question

我正在使用我的angular 6应用程序处理Google图表 npm-google-charts link

现在，当我基于来自服务器的数据绘制图形时，如果我有数据，则该图形将正确绘制，但是如果我没有数据，则将我的datatable属性设置为null，但仍然是旧图形没有擦除。

这是我的代码：

在我的HTML中：

 <google-chart [data]="columnChart" (chartReady)="ready($event)"  (chartError)='error($event)'></google-chart>

在我的TS中：

 //chart initialization and properties
columnChart: GoogleChartInterface = {
chartType: 'ColumnChart',
// dataTable: this.data,
options: {
  height: 600,
  legend: 'none',
  hAxis: {
    direction: -1,
    slantedText: true,
    slantedTextAngle: 90,
    textStyle: {
      fontSize: 11
    }
  },
   vAxis: { gridlines: { count: 20 } },
}
//Method when data is changing
changeData() {
console.log(this.data);
if(this.data.length <= 1)
{
  this.data=[];
  this.columnChart.dataTable = this.data;
  this.columnChart.component.draw();
  this.toastr.error("Unable to find food order details in selected 
month");
}
else{
  this.columnChart.dataTable = this.data;
  this.columnChart.component.draw();
}

在这里，如果数据为空，则将数据表的属性设置为null，但仍然显示图形。如果数据为空，如何绘制空白图表

有人可以帮我吗，谢谢。

Answer 1

尝试使用export class AppComponent { checkFlag = true; unCheckFunc() { this.checkFlag = !this.checkFlag; } }方法...

clearChart

Google图表-无可用数据-无法删除旧图表并显示空白图表？

1 个答案: