react-chartjs-2 hiding axis label

Viewed 39

I'm trying to hide yAxis labels. I tried display: false property, but that didn't work. My code below:

export const options = {
  responsive: true,
  interaction: { includeInvisible: true, intersect: false },
  tooltip: {
    backgroundColor: "rgba(0, 0, 0, 0.3)",
    displayColors: false,
    multiKeyBackground: "rgba(0, 0, 0, 0)",
  },
  scale: {
    y1: {
      min: 0,
      ticks: {
        count: 5,
      },
      grid: { borderDash: [3], color: "rgb(126,126,126)", tickLength: 0 },
    },
    y2: {
      display: false,
      position: "right",
      max: Math.max(...BTCPrices.map((el) => el.Volume)) * 10,
      ticks: {
        count: 5,
      },
    },
    x: {
      ticks: {},
    },
  },
  plugins: {
    legend: {
      display: false,
    },
  },
};

here's the image describing the problem: enter image description here Thanks for helping!

1 Answers

This is because your config is not getting picked up, you putted your scale config in the options.scale namespace white it needs to be configured in the options.scales so you need to add an extra s at the end

Related