react - override the style of canvas

Question

This is the current UI
I want to remove the background-color of the the numbers(1-10), which is #fff.

Is it possible to do so?

App.tsx

import React from "react";
import {
  Chart as ChartJS,
  RadialLinearScale,
  ArcElement,
  Tooltip,
  Legend
} from "chart.js";
import { PolarArea } from "react-chartjs-2";

ChartJS.register(RadialLinearScale, ArcElement, Tooltip, Legend);

export const data = {
  labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
  datasets: [
    {
      label: "# of Votes",
      data: [1, 1, 1, 10, 1, 1],
      backgroundColor: [
        "rgba(255, 99, 132, 0.5)",
        "rgba(54, 162, 235, 0.5)",
        "rgba(255, 206, 86, 0.5)",
        "rgba(75, 192, 192, 0.5)",
        "rgba(153, 102, 255, 0.5)",
        "rgba(255, 159, 64, 0.5)"
      ],
      borderWidth: 1
    }
  ]
};

export function App() {
  return <PolarArea data={data} />;
}

Codesandbox
https://codesandbox.io/s/autumn-sun-ty6egy?file=/App.tsx

Answer 1

I've got the answer from Github

For a PolarArea chart you'd need to set the options like so:

export const options = {
  scales: {
    r: {
      ticks: {
        backdropColor: "rgba(0,0,0,0)"
      }
    }
  }
};

Example:
https://codesandbox.io/s/headless-shadow-b9v2kx?file=/App.tsx:243-363