0

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!

Hassan Naqvi
  • 933
  • 5
  • 18
patrol
  • 1

2 Answers2

0

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

LeeLenalee
  • 27,463
  • 6
  • 45
  • 69
0

This is how I manage to get rid of the labels, I think in your case instead of Y its gonna be y2

  y: {
      ticks: {
        display: false, //this will remove only the label
      },
    },