删除Chart.js上的网格线和数字

5cnsuln7 于 2022-11-06 发布在 Chart.js

关注(0)|答案(2)|浏览(239)

我正在尝试删除chart.js v2上雷达图上的网格线以进行React。
Desired Result，但保留最外面的行，同时移除内部的行和数字
我尝试使用下面的代码，但它只返回一个运行时错误"category" is not a registered scale.

const options = {
  scales: {
    x: {
      grid: {
        display: false
      }
    },
    y: {
      grid: {
        display: false
      }
    }
  }
}

chart.js

来源：https://stackoverflow.com/questions/72917031/remove-grid-lines-and-numbers-on-chart-js

2条答案

按热度按时间

7kjnsjlb1#

这可以通过以下选项来完成。

scale: {
  ticks: {
    stepSize: 1,
    callback: (v, i, values) => i + 1 < values.length ? '' : v
  },
  gridLines: {
    color: [0, 0, 0, 0, '#ccc']
  }
}

有关详细信息，请参阅Chart.jsv2.9.4文档中的Styling页。
请看一下下面的可运行代码，看看它是如何工作的。注意，它使用了一种通用的方法来定义gridLines.color。
第一个

赞(0）回复(0）举报 2022-11-06

qncylg1j2#

从您得到的错误来看，您似乎使用的是Chart.js V3而不是V2。要获得所需的内容，如果您想使用treeshaking，则需要导入并注册所有内容，我建议您在最新部分进行此操作，对于开发，导入所有内容如下所示：

import Chart from 'chart.js/auto';

要隐藏并获得所需的结果，您的配置需要如下所示：
第一个
请注意，我指定的是r比例，而不是x和y

赞(0）回复(0）举报 2022-11-06

我来回答

删除Chart.js上的网格线和数字

2条答案

相关问题

热门标签

最新问答