Chartjs show labels but not ticks

Question

I'm using ChartJS in my React application to render Bar chart with vertical bars and I need to display the label at the bottom of each bar but hide the vertical lines that come in between bars (ticks). Here is what I tried so far:

This does the opposite from what I want, it shows the ticks but not the labels:

xAxes : [ { display : true, // set this to false to hide the labels under the bars ticks: { display : false } }]

This shows everything:

xAxes : [ { display : true, // set this to false to hide the labels under the bars maxTicksLimit: 0 }]

Any suggestions?

dangre00 · Accepted Answer · 2016-08-10 05:25:05Z

1

How about setting the gridline display to false?

xAxes: [{ gridLines: {display:false} }]

FIDDLE HERE

answered Aug 10, 2016 at 5:25

dangre00

4523 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Adrian Khoo · Accepted Answer · 2020-07-13 22:21:05Z

For Chartjs 2.9.3, you can use:

 xAxes: [{ gridLines: { drawTicks: false, } }]

Collectives™ on Stack Overflow

Chartjs show labels but not ticks

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related