react-chartjs-2 刻度不会与中心对齐

问题描述

我正在尝试像这样在中心对齐折线图刻度: Image of what I need to achieve

现在我的图表是这样的:Currently achieved

如您所见,我无法删除 xAxis 上的小线或将它们对齐到中心,而且当我有大量数据时,该线会非常尖 Like this 并且会很平滑与其他行一样。

这是我目前的配置:

data: {
            labels: [],datasets: [
              {
                label: false,data: [],fill: true,borderWidth:2,backgroundColor: '#E0F2FE',borderColor: '#14A1FB',poinTradius: 0,lineTension: 0,cubicInterpolationMode: 'monotone',borderCapStyle: 'round',},],options: {
            animation: {
                duration: 0,responsive: true,layout: {
                padding: 2,maintainAspectRatio: false,legend: {
                display: false
                },scales: {
                alignToPixels: true,yAxes: [{
                    position: 'right',ticks: {
                        align: 'start',mirror: true,z: 1,padding: 5,beginAtZero: false,fontColor: '#9c9c9c',maxTicksLimit: 4,offset: true,gridLines: {
                        drawOnChartArea: true,borderDash: [8,4],beginAtZero: true,drawBorder: false,offsetGridLines: true
                    }
                }],xAxes: [{
                    ticks: {
                        align: 'start',padding: -25,fontFamily: "Roboto Regular",source: "labels",maxTicksLimit: '',autoSkip: true,maxRotation: 0,minRotation: 0,tickColor: "transparent"
                    },gridLines: {
                        align: 'start',drawOnChartArea: false,offsetGridLines: false
                    }
                }]
            }
        }

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)