Chartjs-Chart.js radar scaleShowLine for each scaleLine

by

0👍

✅

Here is a solution using the latest version of chart.js (v2.5.0). It uses the scale afterTickToLabelConversion callback property to overwrite the values that were set for the scale ticks (e.g. scale lines).

Since you only want to display the last line, you have to overwrite them by keeping the first tick value (which is never displayed) and only the last tick value (the last line). If you only wanted to display some other line then you would keep the first tick and only the other line that you want displayed.

Here is my implementation.

afterTickToLabelConversion: function(scaleInstance) {
  // overwrite the ticks and keep the first (never shown) and last
  var oldTicks = scaleInstance.ticks;
  scaleInstance.ticks = [oldTicks[0], oldTicks[oldTicks.length - 1]];

  // overwrite the numerical representation of the ticks and 
  // keep the first (never shown) and last
  var oldTicksAsNumbers = scaleInstance.ticksAsNumbers;
  scaleInstance.ticksAsNumbers = [oldTicksAsNumbers[0], oldTicksAsNumbers[oldTicksAsNumbers.length - 1]];
}

Here is a codepen example that shows an original radar chart and one using the approach described above so that you can see the difference.

Leave a comment