在我用chart.js创建的甜甜圈图上,图例并没有向右移动



由于某种原因,这个用chart.js创建的圆环图上的图例没有向右移动。甚至尝试将规则添加到图表创建本身,而不是将其放入变量中

编辑

经过进一步检查,设置为图例的任何选项似乎都不起作用。

const mobileData = {
labels: ["Desktop", "Tablet", "Phons"],
datasets: [{
label: '# of Users',
data: [2000, 550, 500],
borderWidth: 0,
backgroundColor: [
'#7477BF',
'#78CF82',
'#51B6C8'
]
}]
};
const mobileOptions = {
legend: {
position: 'right',
labels: {
boxwidth: 20,
fontStyle: 'bold'
}
}
}
let mobileChart = new Chart(mobileCanvas,  {
type: 'doughnut',
data: mobileData,
options: mobileOptions
});

这是一个项目的小提琴减去图像。https://jsfiddle.net/5j2ucpv6/3/

您使用的是lib的新V3版本,而不是V2

因此,请阅读chart.js中的迁移指南(https://www.chartjs.org/docs/latest/getting-started/v3-migration.html)

图例选项已移动到插件部分,如

options: {
plugins: {
legend: {
position: 'right'
}
}
}

最新更新