How can I remove the grid lines in Chart.js

Question

I'm using charts in my react app. I tried using the Scales and gridlines: false option but it is not working from me. the image shows my code.

Thank you.

In the future, using code as text is preferred.

Nicolai Mons Mogensen
– Nicolai Mons Mogensen

2020-07-27 06:40:40 +00:00
Commented Jul 27, 2020 at 6:40 — Nicolai Mons Mogensen
– Nicolai Mons Mogensen, Commented Jul 27, 2020 at 6:40

lotype · Accepted Answer · 2020-07-27 06:54:00Z

2

You might check a chart.js sample. From there I found some deviations in the object setup of your example

        var config = {
            type: 'line',
            data: {
                datasets: [{
                    // Here starts your snippet
                }]
            },
            options: {
                // The options are outside of the datasets property
                scales: {
                    x: {
                        gridLines: {
                          display: false
                        }
                    },
                    y: {
                        gridLines: {
                          display: false
                        }
                    }
                }
            }
        };

Edit 1: updated the scales with the gridLines property

answered Jul 27, 2020 at 6:54

lotype

6134 silver badges8 bronze badges

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

Comments

Dima Kozhevin · Accepted Answer · 2020-07-28 09:49:02Z

0

You can use below code to remove gridlines and if you want to enable X and Y axis its useful

 gridLines: {
                  display: true,
                  zeroLineColor:'white',
                  color:'transparent'
                }

edited Jul 28, 2020 at 9:49

Dima Kozhevin

3,77210 gold badges43 silver badges54 bronze badges

answered Jul 28, 2020 at 9:18

Umesh Chityala

12 bronze badges

Collectives™ on Stack Overflow

How can I remove the grid lines in Chart.js

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related