从折线图中删除数据值和 x,y 轴 - Chartjs React

问题描述 投票:0回答:1

我正在为我的 React 应用程序使用 ChartJs 折线图。它在线图上显示了数据值(我的图表中的 65、59、80 等)。是否可以删除或隐藏这些值?

这是我的代码

const data = {
    labels: ['January', 'February', 'March', 'April', 'May'],
    datasets: [
      {
        label: '',
        data: [65, 59, 80, 81, 56],
        borderColor: 'rgba(75, 192, 192, 1)',
        borderWidth: 2,
        fill: false,
        pointStyle: 'hidden', // Hide data points on the chart
      },
    ],
  };

  const options = {
    scales: {
      x: {
        grid: {
          display: false, // Remove x-axis grid lines
        },
        ticks: {
          display: false, // Hide x-axis labels
        },
      },
      y: {
        grid: {
          display: false,
        },
        ticks: {
          display: false, // Hide x-axis labels
        },
      },
    },
    plugins: {
      legend: {
        display: false,
      },
      tooltips: {
        enabled: false, // Hide data values on hover
      },
    },
  };

<Line data={data} options={options} />

谢谢你

reactjs chart.js
1个回答
0
投票

hidden
不是点样式的有效选项。

您应该使用布尔值

false
来禁用它们:

const data = {
    labels: ['January', 'February', 'March', 'April', 'May'],
    datasets: [
        {
            label: '',
            data: [65, 59, 80, 81, 56],
            borderColor: 'rgba(75, 192, 192, 1)',
            borderWidth: 2,
            fill: false,
            pointStyle: false // Hide data points on the chart
        },
    ],
};
© www.soinside.com 2019 - 2024. All rights reserved.