Hide min and max values from y Axis in Chart.js

Question

I have assigned the min and max of Y axes with the tick configuration.But I do not want these min max values to be shown in the graph.I need to hide these values at both the end

Answer 1

In order to hide specific ticks (in your case the first and last tick), you have to use the scale afterTickToLabelConversion callback property and set the value = null of the tick indexes within scaleInstance.ticks that you are wanting to hide. This will prevent them from being drawn on the canvas.

Here is an example that hides the first and last tick (by setting their values = null).

afterTickToLabelConversion: function(scaleInstance) {
  // set the first and last tick to null so it does not display
  // note, ticks[0] is the last tick and ticks[length - 1] is the first
  scaleInstance.ticks[0] = null;
  scaleInstance.ticks[scaleInstance.ticks.length - 1] = null;

  // need to do the same thing for this similiar array which is used internally
  scaleInstance.ticksAsNumbers[0] = null;
  scaleInstance.ticksAsNumbers[scaleInstance.ticksAsNumbers.length - 1] = null;
}

You can see it in action on this codepen example

Answer 2

When using the plugin chartjs-plugin-zoom I only wanted to remove those ticks if they had decimals, as it created a flickering effect when panning.

Implementation:

afterTickToLabelConversion: (scaleInstance) => {
    if (scaleInstance.ticks[0].indexOf(".") > -1) {
        scaleInstance.ticks[0] = null;
        scaleInstance.ticksAsNumbers[0] = null;
    }
    if (scaleInstance.ticks[scaleInstance.ticks.length - 1].indexOf(".") > -1) {
        scaleInstance.ticks[scaleInstance.ticks.length - 1] = null;
        scaleInstance.ticksAsNumbers[scaleInstance.ticksAsNumbers.length - 1] = null;
    }
}

Answer 3

Hiding the max worked this way for me (ng2-charts): I return undefined instead of value to hides tick's value & line

scales: {
      xAxes: [{
        ticks: {
          callback: (value, index, values) => (index == (values.length-1)) ? undefined : value,
        },

...