mirror of
https://github.com/Aider-AI/aider.git
synced 2025-06-01 02:05:00 +00:00
feat: Add bar value labels to charts
This commit is contained in:
parent
f91faf52dc
commit
353b631091
2 changed files with 64 additions and 2 deletions
|
@ -71,9 +71,40 @@ document.addEventListener('DOMContentLoaded', function () {
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
position: 'top',
|
position: 'top',
|
||||||
|
},
|
||||||
|
tooltip: {
|
||||||
|
callbacks: {
|
||||||
|
label: function(context) {
|
||||||
|
let label = context.dataset.label || '';
|
||||||
|
if (label) {
|
||||||
|
label += ': ';
|
||||||
|
}
|
||||||
|
if (context.parsed.y !== null) {
|
||||||
|
label += context.parsed.y.toFixed(1) + '%';
|
||||||
|
}
|
||||||
|
return label;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
|
plugins: [{
|
||||||
|
afterDraw: function(chart) {
|
||||||
|
var ctx = chart.ctx;
|
||||||
|
chart.data.datasets.forEach(function(dataset, i) {
|
||||||
|
var meta = chart.getDatasetMeta(i);
|
||||||
|
meta.data.forEach(function(bar, index) {
|
||||||
|
var data = dataset.data[index];
|
||||||
|
if (data !== null) {
|
||||||
|
ctx.fillStyle = '#000000';
|
||||||
|
ctx.textAlign = 'center';
|
||||||
|
ctx.textBaseline = 'bottom';
|
||||||
|
ctx.fillText(data.toFixed(1) + '%', bar.x, bar.y - 5);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}]
|
||||||
};
|
};
|
||||||
|
|
||||||
// Adjust chart height based on screen width
|
// Adjust chart height based on screen width
|
||||||
|
|
|
@ -69,9 +69,40 @@ document.addEventListener('DOMContentLoaded', function () {
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
position: 'top',
|
position: 'top',
|
||||||
|
},
|
||||||
|
tooltip: {
|
||||||
|
callbacks: {
|
||||||
|
label: function(context) {
|
||||||
|
let label = context.dataset.label || '';
|
||||||
|
if (label) {
|
||||||
|
label += ': ';
|
||||||
|
}
|
||||||
|
if (context.parsed.y !== null) {
|
||||||
|
label += context.parsed.y;
|
||||||
|
}
|
||||||
|
return label;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
|
plugins: [{
|
||||||
|
afterDraw: function(chart) {
|
||||||
|
var ctx = chart.ctx;
|
||||||
|
chart.data.datasets.forEach(function(dataset, i) {
|
||||||
|
var meta = chart.getDatasetMeta(i);
|
||||||
|
meta.data.forEach(function(bar, index) {
|
||||||
|
var data = dataset.data[index];
|
||||||
|
if (data !== null) {
|
||||||
|
ctx.fillStyle = '#000000';
|
||||||
|
ctx.textAlign = 'center';
|
||||||
|
ctx.textBaseline = 'bottom';
|
||||||
|
ctx.fillText(data, bar.x, bar.y - 5);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}]
|
||||||
};
|
};
|
||||||
|
|
||||||
// Adjust chart height based on screen width
|
// Adjust chart height based on screen width
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue