Search code examples
javascriptchart.jsvue-chartjs

Chart.js - 2 does not display Axes labels


i am trying to plot a line graph using vue-chartjs and Chart.js (2.7.1). the graph is displayed, but there are no xAxes and yAxes labels.

This is my options object:

title: {
    display: true,
    text: 'Title',
},
responsive: true,
maintainAspectRatio: false,
elements: {
    line: {
        fill: false
    }        
},
scales: {
    xAxes: {
        scaleLabel: {
            display: true,
            labelString: 'LabelX',
        }
    },
    yAxes: {
        scaleLabel: {
            display: true,
            labelString: 'LabelY',
        }
    },
}

I think that scales.xAxes.scaleLabel don't working.


Solution

  • You are trying to use V3 syntax with V2 that won't work. You will have to put it like this:

    scales:{
      xAxes: [
        {
           scaleLabel: {
             display: true,
              labelString: 'text'
           }
         }
      ],
      yAxes: [
        {
           scaleLabel: {
             display: true,
              labelString: 'text'
           }
         }
      ]
     }