Radial Axes

• radialLinear

A radial axis is composed of visual components that can be individually configured. These components are:

• grid lines
• ticks

The grid lines for an axis are drawn on the chart area. They stretch out from the center towards the edge of the canvas. In the example below, they are red.

const data = {
  labels: labels,
  datasets: [{
    label: 'My First dataset',
    backgroundColor: 'rgba(54, 162, 235, 0.5)',
    borderColor: 'rgb(54, 162, 235)',
    data: [10, 20, 30, 40, 50, 0, 5],
  }]
};

The grid lines for an axis are drawn on the chart area. In the example below, they are red.

config setup

const labels = Utils.months({count: 7});
const data = {
  labels: labels,
    label: 'My First dataset',
    backgroundColor: 'rgba(54, 162, 235, 0.5)',
    borderColor: 'rgb(54, 162, 235)',
    borderWidth: 1,
    data: [10, 20, 30, 40, 50, 0, 5],
  }]
};

config setup

const labels = Utils.months({count: 7});
const data = {
  labels: labels,
    label: 'My First dataset',
    backgroundColor: 'rgba(54, 162, 235, 0.5)',
    borderWidth: 1,
    data: [10, 20, 30, 40, 50, 0, 5],
  }]
};

The ticks are used to label values based on how far they are from the center of the axis. In the example below, they are red.

config setup

const labels = Utils.months({count: 7});
const data = {
  labels: labels,
  datasets: [{
    label: 'My First dataset',
    backgroundColor: 'rgba(54, 162, 235, 0.5)',
    borderColor: 'rgb(54, 162, 235)',
    borderWidth: 1,
    data: [10, 20, 30, 40, 50, 0, 5],