隐藏X轴上的刻度剪辑图表(Chart.js)

Question

我试图将tick隐藏在气泡图的X轴上。

我尝试在ticks属性中使用" display：false"。

它确实删除了刻度，但是现在剪切了图表。

有没有一种方法可以隐藏这些壁虱而不会影响图表的外观或添加一些填充物，以免影响图表的外观？

删除tick之前出现

剪切一旦tick被删除，用"显示：false"

您可以看到我在下面创建的图表的代码：

xAxes : [
    {
        id : 'first-x-axis',
        ticks : {
            display : false,
            min :  <  ? php echo $min ?  > , // Controls where axis starts
            max :  <  ? php echo $max ?  > , // Controls where axis finishes
            stepSize :  <  ? php echo $step ?  > // Control the gap between the first x-axis value and the last x-axis value
        },
        gridLines : {
            display : false,
            lineWidth : 7 // Width of bottom line
        }
    }
]

我感谢任何帮助或建议 ^_ ^

Answer 1

我弄清楚了！

您可以在" Gridlines"中使用" tickmarkLength"调整刻度标记的高度/长度

您可以看到以下解决方案的代码：

xAxes: [
    {
        id: 'first-x-axis',
        ticks: {
            display: false,
            min: <?php echo $min ?>, // Controls where axis starts
            max: <?php echo $max ?>, // Controls where axis finishes
            stepSize: <?php echo $step ?> // Control the gap between the first x-axis value and the last x-axis value
        },
        gridLines: {
            display: false,
            lineWidth: 7,
            tickMarkLength: 30// Adjusts the height for the tick marks area
        }
    }
]

我希望这会有所帮助！