charts - new - En Chart.js establece el título del gráfico, el nombre del eje x y el eje y?

new chart

Question

¿Chart.js ( documentation ) tiene una opción para que los conjuntos de datos establezcan el nombre (título) del gráfico (por ejemplo, Temperatura en mi ciudad), el nombre del eje x (por ejemplo, Días) y el nombre del eje y (por ejemplo, Temperatura). ¿O debería resolver esto con css?

var lineChartData = {
labels : ["January","February","March","April","May","June","July"],
datasets : [
{
fillColor : "rgba(220,220,220,0.2)",
strokeColor : "rgba(220,220,220,1)",
pointColor : "rgba(220,220,220,1)",
pointStrokeColor : "#fff",
pointHighlightFill : "#fff",
pointHighlightStroke : "rgba(220,220,220,1)",
data : [data]
}
]
}

Realmente gracias por la ayuda.

Answer 1

En la versión 2.0 de Chart.js, es posible establecer etiquetas para los ejes:

options = {
scales: {
yAxes: [{
scaleLabel: {
display: true,
labelString: ''probability''
}
}]
}
}

Ver la documentación de etiquetado para más detalles.

Answer 2

Si ya ha establecido etiquetas para su eje, como mencionaron @andyhasit y @Marcus, y desea cambiarlas más adelante, puede intentar esto:

chart.options.scales.yAxes[ 0 ].scaleLabel.labelString = "New Label";

Configuración completa para referencia:

var chartConfig = {
type: ''line'',
data: {
datasets: [ {
label: ''DefaultLabel'',
backgroundColor: ''#ff0000'',
borderColor: ''#ff0000'',
fill: false,
data: [],
} ]
},
options: {
responsive: true,
scales: {
xAxes: [ {
type: ''time'',
display: true,
scaleLabel: {
display: true,
labelString: ''Date''
},
ticks: {
major: {
fontStyle: ''bold'',
fontColor: ''#FF0000''
}
}
} ],
yAxes: [ {
display: true,
scaleLabel: {
display: true,
labelString: ''value''
}
} ]
}
}
};

Answer 3

solo usa esto:

<script>
var ctx = document.getElementById("myChart").getContext(''2d'');
var myChart = new Chart(ctx, {
type: ''bar'',
data: {
labels: ["1","2","3","4","5","6","7","8","9","10","11",],
datasets: [{
label: ''YOUR LABEL'',
backgroundColor: [
"#566573"
"#99a3a4",
"#dc7633",
"#f5b041",
"#f7dc6f",
"#82e0aa",
"#73c6b6",
"#5dade2",
"#a569bd",
"#ec7063",
"#a5754a"
],
data: [12, 19, 3, 17, 28, 24, 7, 2,4,14,6],
},]
},
//HERE COMES THE AXIS Y LABEL
options : {
scales: {
yAxes: [{
scaleLabel: {
display: true,
labelString: ''probability''
}
}]
}
}
});
</script>