Chart.js – y axis custom label

I have simple line graph which is show some progress. There are dates on x-axis a and status (1 to 5) on y-axis. Data will always be from 1 to 5. But what I need is to change labels on y-axis (and labels on point hover too) from numbers to showing progress by text string. For example where is 1 a I need text string with “request added”, on 2 “request viewed”, on 3 “request accepted” on 4 “request solved” and on 5 “solving confirmed”. I think there is no native way to achieve this, but maybe someone will know how to edit Chart.js to make it.

Here is a picture how it looks now, with these number: screenshot

  • using library without 'require' when using CDN
  • Chartjs Bar Chart Legend
  • Chart.js: only show labels on x-axis for data points
  • Multiple tooltip is not visible when adding dynamic points in chartjs
  • Hide labels on x-axis ChartJS
  • Limit labels number on Chart.js line chart
  • Sorry for my english and thx for any help!

  • set y-axis scale manually in a bar chart using angular-chart.js
  • Chart.js number Y-AXIS label format for many decimal places
  • Destroy chart.js bar graph to redraw other graph in same <canvas>
  • How can labels/legends be added for all chart types in chart.js (chartjs.org)?
  • Set min, max and number of steps in radar chart.js
  • Chart.js and right side free space
  • One Solution collect form web for “Chart.js – y axis custom label”

    You can use the scaleLabel function. Have a look here https://stackoverflow.com/a/28700578/909535

    scaleLabel: function (valuePayload) {
    if(Number(valuePayload.value)===1)    
    return 'request added';
    if(Number(valuePayload.value)===2)    
    return 'request viewed';
    if(Number(valuePayload.value)===3)    
    return 'request accepted';
    if(Number(valuePayload.value)===4)    
    return 'request solved';
    if(Number(valuePayload.value)===5)    
    return 'solving confirmed';
    }