I have been trying to use axes call backs to do the following:
scales: {
callbacks: {
afterDataLimits: function (axis) {
console.log("callback for..", axis);
if (axis.id == "right-y-axis") {
var absMax = Math.max(Math.abs(axis.ticks.min), Math.abs(axis.ticks.max));
axis.ticks.min = -absMax;
axis.ticks.max = absMax;
}
}
},
After the datalimits had been determined I had hoped to then reset them to my own min and max values to ensure zero was always at centre and then tick scaling could be executed in the next part of the the process so this keeps much of chart.js dynamical scaling.
But it doesn't work, in fact the callback never even seems to be registered, and I have tried other callback without success.
A mock up of the problem is viewable at:
https://codepen.io/attack68/pen/BwbYQK
@attack68 the callbacks get inserted into each axis config. Also, the ticks.min and ticks.max are stored on axis.options. See https://codepen.io/etimberg/pen/NamPMK
I think the Axes docs are confusing in this situation. It seems like the config would be:
scales: {
xAxes: [{
id: 'x-axis-1',
callbacks: {
afterDataLimits: function (axis) {
},
}
}]
}
but it actually should be:
scales: {
xAxes: [{
id: 'x-axis-1',
afterDataLimits: function (axis) {
},
}]
}
@bhrutledge I'm happy to merge a PR that improves the docs. Maybe dropping this example in would be a good idea. What do you think?
@etimberg I could put that together, although I'd like to have a concrete example of a callback that does something useful. I've only used it as a hack in #4440. Any suggestions?
There's now a sample that uses these callbacks. Seems OK for the time being. https://github.com/chartjs/Chart.js/blob/f1ed2ee932621d8d7d3a5ea81b9bd30992294e38/samples/scales/financial.html#L147
Most helpful comment
I think the Axes docs are confusing in this situation. It seems like the config would be:
but it actually should be:
See: https://github.com/chartjs/Chart.js/blob/b4d69247b055e25c87bf67019112495c5fa982db/src/core/core.scale.js#L303