How to set ChartJS Y axis title

Question

I am using Chartjs for showing diagrams and I need to set title of y axis  but there are no information about it in documentation    I need y axis to be set like on picture  or on top of y axis so someone could now what is that parameter    I have looked on official website but there was no information about it

User · Answer

For me it works like this       options           scales            yAxes               scaleLabel                display  true              labelString   probability

User · Answer

For Chart js 2 x refer to andyhasit s answer - https   stackoverflow com a 36954319 360067  For Chart js 1 x  you can tweak the options and extend the chart type to do this  like so  Chart types Line extend       name   LineAlt       draw  function              Chart types Line prototype draw apply this  arguments            var ctx   this chart ctx          ctx save               text alignment and color         ctx textAlign    center           ctx textBaseline    bottom           ctx fillStyle   this options scaleFontColor             position         var x   this scale xScalePaddingLeft   0 4          var y   this chart height   2             change origin         ctx translate x  y              rotate text         ctx rotate -90   Math PI   180           ctx fillText this datasets 0  label  0  0           ctx restore                calling it like this  var ctx   document getElementById  myChart   getContext  2d    var myLineChart   new Chart ctx  LineAlt data           make enough space on the right side of the graph     scaleLabel              lt   value  gt         Notice the space preceding the label value  this gives us space to write the y axis label without messing around with too much of Chart js internals    Fiddle - http   jsfiddle net wyox23ga

User · Answer

For x and y axes        options           scales            yAxes               scaleLabel                display  true              labelString   probability                                  xAxes               scaleLabel                display  true              labelString   hola

User · Answer

Consider using a the transform  rotate -90deg  style on an element  See http   www w3schools com cssref css3 pr transform asp  Example  In your css   verticaltext content     position  relative    transform  rotate -90deg     right 90px      These three positions need adjusting   bottom 150px    based on your actual chart size   width 200px      Add a space fudge factor to the Y Axis scale so the text has room to render in your javascript   scaleLabel          lt   value  gt     Then in your html after your chart canvas put something like      lt div class  text-center verticaltext content  gt Y Axis Label lt  div gt    It is not the most elegant solution  but worked well when I had a few layers between the html and the chart code  using angular-chart and not wanting to change any source code

User · Answer

In Chart js version 2 0 this is possible   options       scales        yAxes           scaleLabel            display  true          labelString   probability                         See axes labelling documentation for more details

User · Answer

chart js supports this by defaul check the link  chartjs  you can set the label in the options attribute   options object looks like this   options                 scales                    yAxes                                                  id   y-axis-1                           display  true                          position   left                           ticks                                callback  function value  index  values                                    return value                                                                                         scaleLabel                               display  true                              labelString   Average Personal Income                               fontColor    546372

[javascript] How to set ChartJS Y axis title?

Examples related to javascript

Examples related to jquery

Examples related to charts

Examples related to chart.js