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';
}
Adam Výborný
Updated on June 04, 2022Comments
-
Adam Výborný almost 2 years
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
Sorry for my english and thx for any help!
-
Adam Výborný about 9 yearsIt returns undefined: dropbox.com/s/rzr24ds6r8e03in/…
-
meteor about 9 yearsUpdated the answer..Try now.. Could you provide your code in a jsfiddle?
-
Adam Výborný about 9 yearsNow it is work great, thx. And how to achieve same thing in pop-up when I hover a point in graph?
-
meteor about 9 yearsOk can you provide a jsfiddle so that everyone can see what your code is? Also accept the answer if it solves the issue!
-
Adam Výborný about 9 yearsJSFiddle here: jsfiddle.net/mayankcpdixit/6xV78 I will accept answer as soon as second part of question will be solved. Thx again for help :)
-
meteor about 9 yearsAre you sure you have the right fiddle your screenshot looks different from this one!!
-
Adam Výborný about 9 yearsJSfiddle is for exemple, I can't use whole my code, because it is generated by php from mysql tables and so on...
-
meteor about 9 yearsIt's similar to this one except you have to use
showTooltip: true,
tooltipTemplate: "<%= value %>"
and more info can be found here stackoverflow.com/a/25208214/909535