使用 Chartjs Radar - 如何修改灰色网格线？

Question

我在我的 React 应用程序中使用 react-chartjs-2 渲染了以下 Chart.js 雷达图：

          <Radar
            data={chartData}
            options={{
              legend: false,
              gridLines: {
                 display: false,
              },
              scale: {
                gridLines: {
                  color: ['white', 'white', 'white', 'white', 'white', 'white', 'white', 'white']
                },
                pointLabels :{
                  fontSize: 12,
                },
                ticks: {
                  suggestedMin: 0,
                  suggestedMax: 10,
                  display: false,
                  maxTicksLimit: 5
                }
              }
            }}
          />

如何隐藏灰色线条and/or修改颜色为白色？

Answer 1

尝试将 angleLines 添加到您的 scale 配置中。此 JSFiddle 提供了一个包含大量配置更改的示例。

scale: {
    angleLines: {
        color: 'white' // lines radiating from the center
    }
}

Answer 2

如果要隐藏灰线，

options: {
    scale: {
      gridLines: {
        color: 'transparent'
      },
      angleLines: {
        color: 'transparent' 
      }
    }
  }
};

现在如果你想让线条变成白色，只需将颜色从透明改为白色

使用 Chartjs Radar - 如何修改灰色网格线？

With Chartjs Radar - how to modify the gray gridlines?

reactjs

charts

react-chartjs