[Chartjs]-Impossible to remove scale from radar chart (chart.js)

by

5👍

options: {
     scales: {
         r: {
            pointLabels: {
                display: false // Hides the labels around the radar chart
            },
            ticks: {
                display: false // Hides the labels in the middel (numbers)
            }
        }
    }
}

2👍

The linear radial axis documentation lists four configuration options (as of v2.9.3):

  • angleLines
  • gridLines
  • pointLabels
  • ticks

Each of these is an object that supports the display property. Specifying display: false in all four objects removes the scale.

options: {
  scale: {
    angleLines: {
      display: false
    },
    gridLines: {
      display: false
    },
    pointLabels: {
      display: false
    },
    ticks: {
      display: false
    },
  }
}

Here’s a working example: 

new Chart('myChart', {
  type: 'radar',
  data: {
    labels: ['A', 'B', 'C', 'D'],
    datasets: [{
      label: 'Series 1',
      data: [0.25, 0.3, 0.15, 0.3],
    }]
  },
  options: {
    scale: {
      angleLines: {
        display: false
      },
      gridLines: {
        display: false
      },
      pointLabels: {
        display: false
      },
      ticks: {
        display: false
      },
    }
  }
});
<script src="https://cdn.jsdelivr.net/npm/chart.js@2.9.3/dist/Chart.min.js"></script>
<canvas id="myChart"></canvas>

Leave a comment