CODEWITHSUNDEEP
google-visualization
tarek fellah
tarek fellah

Reputation: 367

Google charts displaying zigzag labels in x axis

I have a problem in the google chart display, in x axis, the labels are displays in zigzag like this

enter image description here.

I would like it like this enter image description here

    var data = new google.visualization.DataTable();
        data.addColumn('string','Mois');
    data.addColumn('number', 'Depense');
    data.addColumn('number', 'Depasse');




            new google.visualization.ColumnChart(document
                                    .getElementById('visualizationNatM'))
                                    .draw(data, {
                                         width:viewport.width,
                                        height : viewport.height - 400,

                                        isStacked : true,
                                        legend : {
                                            position : 'none'
                                        },
                                        sortData: false,
                                        hAxis : {
                                            gridlines : {
                                                count : 12
                                            }
                                        },
                                        colors : [ '#a8cf04', '#d44c33' ],
                                        backgroundColor : '#FFFFFF',
                                        chartArea : {
                                            left : 70
                                        }
                                    });

Any one have a solution to this problem?

Upvotes: 1

Views: 1693

Answers (1)

asgallant
asgallant

Reputation: 26340

Try setting the hAxis.maxAlternation, hAxis.showTextEvery, and hAxis.minTextSpacing options:

hAxis : {
    gridlines : {
        count : 12
    },
    maxAlternation: 1, // use a maximum of 1 line of labels
    showTextEvery: 1, // show every label if possible
    minTextSpacing: 8 // minimum spacing between adjacent labels, in pixels
}

Upvotes: 3

Related Questions