Chart.js: BeginAtZero and stepsize not working on radar chart

Created on 2 May 2017  路  7Comments  路  Source: chartjs/Chart.js

I want to show only integers in labels of a radar chart. I check many solutions i found on here and stackoverflow.
I set stepsize:1 and seems is doing nothing... when max scale value is 1 or 2 it show many float values like 0.2,0.4,0.6...
Also, i check this:

userCallback: function(label, index, labels) {
                           // when the floored value is the same as the value we have a whole number
                           if (Math.floor(label) === label) {
                               return label;
                           }
}        

and is not working.

Also i set min:0 on my scale. But when every value of my chart is 0, scale is between -1 and 1.

Not sure if this an issue or im doing something wrong.

Thanks.

needs test case bug

Most helpful comment

@borjaevo the issue here was that the config was incorrect. It should be

options: {
    scale: {
        ticks: {
            beginAtZero: true,
            min: 0,
            userCallback: function(label, index, labels) {
                // when the floored value is the same as the value we have a whole number
                if (Math.floor(label) === label) {
                    return label;
                }
            },
        }
    }
}

All 7 comments

@borjaevo what version are you using? Do you have a test case that reproduces this?

Hi,

Version is 2.5.0.

This is the code:

`
var hourlyActChart = new Chart(ctx, {

     type: 'radar',

     data: data,

     options: {

         scales: {
            scale: {
                ticks: {
                    beginAtZero: true,
                    min: 0,
                    userCallback: function(label, index, labels) {
                       // when the floored value is the same as the value we have a whole number
                       if (Math.floor(label) === label) {
                           return label;
                       }
                   },
                }
            }
        }
    }
 })

`

Thanks

@borjaevo could you try the latest code from master and see if it reproduces? Also, could you put that test case in a fiddle?

@etimberg Hi, I am having the same problem with both 2.5.0 and the latest version from master (20452dd).
Also, simply replacing chart.js 2.5.0 with the latest build from master broke all my charts except radar and polar-area. The canvas is empty and there is the following stacktrace in Chrome log:
Chart.js:6055 Uncaught TypeError: Cannot read property 'skip' of undefined at parseVisibleItems (http://localhost:8080/cbVaadin-demo/APP/PUBLISHED/Chart.js:6055:23) at single (http://localhost:8080/cbVaadin-demo/APP/PUBLISHED/Chart.js:6163:5) at Chart.getElementsAtEventForMode (http://localhost:8080/cbVaadin-demo/APP/PUBLISHED/Chart.js:4318:12) at Chart.handleEvent (http://localhost:8080/cbVaadin-demo/APP/PUBLISHED/Chart.js:4531:20) at Chart.eventHandler (http://localhost:8080/cbVaadin-demo/APP/PUBLISHED/Chart.js:4489:21) at listener (http://localhost:8080/cbVaadin-demo/APP/PUBLISHED/Chart.js:4424:21) at HTMLCanvasElement.proxies.(anonymous function) (http://localhost:8080/cbVaadin-demo/APP/PUBLISHED/Chart.js:9923:5) parseVisibleItems @ Chart.js:6055 single @ Chart.js:6163 getElementsAtEventForMode @ Chart.js:4318 handleEvent @ Chart.js:4531 eventHandler @ Chart.js:4489 listener @ Chart.js:4424 proxies.(anonymous function) @ Chart.js:9923

@borjaevo the issue here was that the config was incorrect. It should be

options: {
    scale: {
        ticks: {
            beginAtZero: true,
            min: 0,
            userCallback: function(label, index, labels) {
                // when the floored value is the same as the value we have a whole number
                if (Math.floor(label) === label) {
                    return label;
                }
            },
        }
    }
}

@etimberg Thank you!

@etimberg Oh, sorry, I made the same mistake. Thanks for the clarification!

Was this page helpful?
0 / 5 - 0 ratings