[Chartjs]-How do I remove the ticks or inner circles of my polar area chart Chart.js

by

2👍

✅

In v3 the radialLinear scale is not configured in the scale object anymore but also in the scales namespace with namespace r for radial. Also it shouldn’t be configured in the plugins section but in the root of the the options object.
And as last the gridLines has been renamed to grid.

For all changes between V2 and V3 please read the migration guide

Live example:

const options = {
  type: 'polarArea',
  data: {
    labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
    datasets: [{
      label: '# of Votes',
      data: [12, 19, 3, 5, 2, 3],
      backgroundColor: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"]
    }]
  },
  options: {
    scales: {
      r: {
        ticks: {
          display: false // Remove vertical numbers
        },
        grid: {
          display: false // Removes the circulair lines
        }
      }
    }
  }
}

const ctx = document.getElementById('chartJSContainer').getContext('2d');
new Chart(ctx, options);
<body>
  <canvas id="chartJSContainer" width="600" height="400"></canvas>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.7.0/chart.js"></script>
</body>

Leave a comment