Fix chart resize regression due to chart.js v4 update (#8298)

* Fix chart resize regression due to chart.js v4 update

* Update to chart.js v4.5.1 + add .map file for easier debugging

https://github.com/chartjs/Chart.js/releases/tag/v4.5.1

* Delete .map file
This commit is contained in:
Inverle
2025-12-09 00:59:10 +01:00
committed by GitHub
parent ec26638124
commit bb9089aa99
2 changed files with 32 additions and 2 deletions

View File

@@ -36,6 +36,36 @@ function initCharts() {
/* eslint-enable no-new */
}
// Force resize after clicking enlarge button (needed since chart.js v4)
for (const id in Chart.instances) {
const instance = Chart.instances[id];
const boxTitle = instance.canvas.parentElement.previousElementSibling;
const enlargeBtns = boxTitle.querySelectorAll('a.btn');
function forceResize() {
function waitHash() {
requestAnimationFrame(() => instance.resize());
window.removeEventListener('hashchange', waitHash);
}
instance.resize(); // try early resize
window.addEventListener('hashchange', waitHash);
}
for (const btn of enlargeBtns) {
btn.addEventListener('click', forceResize);
}
}
window.addEventListener('resize', () => {
for (const id in Chart.instances) {
const instance = Chart.instances[id];
// Workaround for a chart.js bug which makes the canvas blurry if
// page was loaded with very low zoom level and later zoomed in
instance.update();
instance.resize();
}
});
if (window.console) {
console.log('Chart.js finished');
}

View File

File diff suppressed because one or more lines are too long