通过设置options来实现。要隐藏标签和背景层,我们需要在options中设置相应的配置选项。示例代码如下:
HTML模板:
TypeScript代码: import { Component } from '@angular/core';
@Component({ selector: 'app-bar-chart', templateUrl: './bar-chart.component.html', styleUrls: ['./bar-chart.component.css'] }) export class BarChartComponent {
public barChartOptions = { responsive: true, scales: { xAxes: [{ display: false // 隐藏标签 }], yAxes: [{ ticks: { beginAtZero: true }, gridLines: { display: false // 隐藏背景层 } }] } };
public barChartLabels = ['January', 'February', 'March', 'April', 'May', 'June', 'July']; public barChartType = 'bar'; public barChartLegend = true;
public barChartData = [ { data: [65, 59, 80, 81, 56, 55, 40], label: 'Series A' }, { data: [28, 48, 40, 19, 86, 27, 90], label: 'Series B' } ];
}
通过以上代码,我们可以在options中配置相应选项来隐藏标签和背景层。具体方法是在相关选项中设置display: false。例如,通过设置display: false来隐藏标签,通过设置gridLines.display: false来隐藏背景层。