react-chartjs-2如何实现折线图y轴数值隐藏和悬停tooltip关闭

你需要对你代码里的options对象做两处修改即可实现需求：

• 关闭tooltip：在tooltips配置中新增enabled: false属性
• 隐藏左侧y轴刻度：在左侧y轴（id为y-axis-1）的配置中新增ticks: { display: false }，如果需要完全隐藏整个左侧y轴（包含轴线、网格线），直接把该轴的display属性改为false即可

修改后的完整代码如下：

import React from "react";
import { Bar } from "react-chartjs-2";

const data = {
  labels: ["January", "February", "March", "April", "May", "June", "July"],
  datasets: [
    {
      label: "Sales",
      type: "line",
      data: [51, 300, 40, 49, 60, 37, 40],
      fill: false,
      borderColor: "#555555",
      backgroundColor: "#555555",
      pointBorderColor: "#000000",
      pointBackgroundColor: "#EC932F",
      pointHoverBackgroundColor: "#EC932F",
      pointHoverBorderColor: "#EC932F",
      yAxisID: "y-axis-1"
    },
    {
      type: "bar",
      label: "Visitor",
      data: [200, 185, 590, 621, 250, 400, 95],
      fill: false,
      backgroundColor: "#F7C520",
      borderColor: "#F7C520",
      hoverBackgroundColor: "#E6B71E",
      hoverBorderColor: "#E6B71E",
      yAxisID: "y-axis-1"
    }
  ]
};

const options = {
  responsive: true,
  tooltips: {
    mode: "label",
    enabled: false // 新增：关闭tooltip显示
  },
  elements: {
    line: {
      fill: false
    }
  },
  scales: {
    xAxes: [
      {
        display: true,
        gridLines: {
          display: true
        }
      }
    ],
    yAxes: [
      {
        type: "linear",
        display: true,
        position: "left",
        id: "y-axis-1",
        gridLines: {
          display: true
        },
        ticks: {
          display: false // 新增：隐藏左侧y轴刻度数值
        }
      },
      {
        type: "linear",
        display: true,
        position: "right",
        id: "y-axis-2",
        gridLines: {
          display: false
        }
      }
    ]
  }
};

class MixExample extends React.Component {
  render() {
    return (
      <div>
        <h2>Mixed data Example</h2>
        <Bar data={data} options={options} />
      </div>
    );
  }
}

export default MixExample;

内容的提问来源于stack exchange，提问作者user16590865