Chart.js 图表标签更新了但数据不显示，根本原因是配置对象中 data 结构未正确定义——datasets 必须是包含至少一个数据集对象的数组，而非空数组或未初始化对象。
chart.js 图表标签更新了但数据不显示，根本原因是配置对象中 `data` 结构未正确定义——`datasets` 必须是包含至少一个数据集对象的数组，而非空数组或未初始化对象。
在你最初的 creerGraph() 函数中，data: [] 的写法是错误的。Chart.js 要求 data 是一个对象，且必须包含 labels 数组和 datasets 数组（后者每个元素是一个含 data、backgroundColor 等属性的对象）。将 data: [] 写成 data: [] 会导致 chart.data.datasets 为 undefined，因此后续 dataset.data.push(...) 实际执行失败，控制台虽无报错，但数据始终无法写入。
✅ 正确的初始化方式如下：
function creerGraph() {
const ctx = document.getElementById("myChart");
const config = {
type: 'pie',
data: {
labels: [], // 标签容器（字符串数组）
datasets: [{
data: [], // 数值数据（数字数组）
backgroundColor: [], // 颜色数组（与 data 长度一致）
borderWidth: 0 // 可选：去除饼图边框更美观
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
legend: { position: 'top' }
}
},
plugins: []
};
window.chart = new Chart(ctx, config); // 建议加 window. 显式声明全局变量，避免作用域问题
}
随后，在 ajouteDonnees() 中，你无需遍历 datasets（因为只有一个数据集），可直接操作首个数据集：
function ajouteDonnees(tabDonnees) {
const colors = ['#fc5c65','#fd9644','#fed330','#26de81','#2bcbba','#45aaf2','#4b7bec','#a55eea','#778ca3'];
tabDonnees.forEach((item, i) => {
chart.data.labels.push(item.Libellé);
chart.data.datasets[0].data.push(item.Nombre);
chart.data.datasets[0].backgroundColor.push(colors[i % colors.length]); // 防止索引越界
});
chart.update(); // 触发重绘，必需
}
⚠️ 注意事项：
-
不要用
chart.data.datasets.forEach(...)：若datasets未正确定义（如为[]或undefined），该循环不会执行，也不会报错，极易被忽略； -
确保
tabDonnees是标准 JavaScript 数组：WEBDEV 导出的结构表需通过.toJSArray()或类似方法转换（依 WEBDEV 版本而定），否则length和索引访问可能异常； -
调用
chart.update()是必须步骤：仅修改数据属性不会自动刷新图表； -
颜色数组长度不足时使用取模
%：避免colors[i]报undefined，提升鲁棒性。
完成上述修正后，图表即可正常渲染标签与对应数据。建议首次调试时在 ajouteDonnees 开头添加 console.log(chart.data)，验证 datasets[0].data 是否已正确填充。
