我一直很难找到能够向我展示如何控制/自定义图表及其属性的所有可能功能的文档。
我想知道我是否在horizontalBar
图表中显示数据是否有办法让长标签文字换行?我的图表大小受该功能的影响,我找不到允许我换行标签文字的方法。
我还想知道是否存在属性,以便我可以使用条形控制图形的实际宽度,而不会影响垂直标签宽度。因此,我可以为垂直标签文本提供更多空间,并为图形部分提供更少空间。
以下是我目前正在渲染图表的方式:
barChartOptions: any = {
scaleShowVerticalLines: false,
responsive: true,
scales: {
xAxes: [{
ticks: {
beginAtZero:true,
max: 100
}
}],
yAxes: [{
ticks: {
}
}]
},
tooltips:{
mode: 'point'
}
};
barChartLabels: string[] = [];
barChartType: string = 'horizontalBar';
barChartLegend: boolean = false;
barChartData: any[] = [];
data: any;
colorsOverride: Array<Color> = [{
backgroundColor: '#6aaf6a',
hoverBackgroundColor: 'purple'
}];
getChartData(link:string){
this.service.getQuery(link).subscribe(
data => {
this.data = data;
this.barChartLabels = this.data.map(x => x.display);
this.chartData = this.data.map(x => x.value);
this.barChartData = [{data: this.chartData, label:'sample' }];
}
);
}