我知道如何使用 chart.js
var myBarChart = new Chart(ctx, {
type: 'bar',
data: data,
options: options
});
,但看起来使用 ng2-charts 并不那么容易。我有这个
<canvas baseChart
[datasets]="[{data: [65, 59, 80], label: 'Series A'}]"
[labels]="[['Eingezahlte', 'Beiträge'], ['Guthaben', 'heute'], ['Guthaben nach', 'Rückzahlung']]"
[chartType]="'bar'">
</canvas>
1)我需要不同的颜色 2)对齐问题(当我通过将长标签分隔为数组来修复长标签时)
更新 终于我来了
<canvas baseChart
[datasets]="barChartData"
[labels]="['']"
[chartType]="'bar'"
[legend]="false"
[options]="options"
>
</canvas>
public barChartData:any[] = [
{
data: ['7000'], label: 'Eingezahlte Beiträge'
},
{
data: ['6000'], label: 'Guthaben heute'
},
{
data: ['10000'], label: 'Guthaben nach Rückzahlung'
}
];
public options = {
scales: {
yAxes: [{
ticks: {
beginAtZero: true,
maxTicksLimit: 5,
// Create scientific notation labels
callback: function(value, index, values) {
return value + ' €';
}
}
}],
xAxes: [{
categoryPercentage: 1.0,
barPercentage: 0.6
}]
}
};
剩下的唯一问题是我想要底部的标签,但我可以用 html