En Chart.JS (v3), ¿cómo puedo cambiar mediante programación la etiqueta del eje Y?
myChart.scales.y.text=yaxislabel;
y
myChart.options.scales[0].title.text=yaxislabel;
... no lo cambia, y obtengo errores como:
Uncaught TypeError: myChart.options.scales[0] is undefined
... aunque todo el resto de los conjuntos de datos y las etiquetas se actualizan bien con mi código a continuación:
My chart is setup with:
// define chart options
const options = {
plugins: { // 'legend' now within object 'plugins {}'
legend: {
labels: {
color: "white",
// fontSize: 18 // not 'fontSize:' anymore
}
}
},
maintainAspectRatio: false,
scales: {
x: {
title: {
display: true,
text: 'Days',
color: 'white'
},
grid: {
color: 'rgb(239,96,36,0.5)',
borderColor: '#ef6024'
},
ticks: {
color: '#ffffff',
stepSize: 50
}
},
y: {
title: {
display: true,
text: 'Weight (kg)',
color: '#ffffff'
},
grid: {
color: 'rgb(239,96,36,0.5)',
borderColor: '#ef6024'
},
ticks: {
color: '#ffffff',
//stepSize: 50,
beginAtZero: true
}
}
}
};
const config = {
type: 'line',
data: data,
options: options,
};
const myChart = new Chart(
document.getElementById('myChart'),
config
);
$yaxislabel = 'kg';
myChart.data.datasets[0].data = Object.values(varsdata);
myChart.data.labels= Object.values(varslabels);
myChart.data.datasets[0].label = chartdatalabel;
myChart.scales.y.text=yaxislabel; <-- doesn't work
myChart.options.scales[0].title.text=yaxislabel <-- doesn't work
myChart.update();
Thanks, Mark
Esto se debe a que debe colocarlo en el espacio de nombres del title . Entonces su declaración debe ser: myChart.options.scales.y.title.text=yaxislabel; . Para que aparezca, también debe asegurarse de que esté habilitado llamando: myChart.options.scales.y.title.display = true;