How do I align date and values to gridlines in Google Chart?

Question

I\'m using Google Chart in my application with the following code (JSFiddle):

google.load(\'visualization\', \'1\', {packages: [\'corechart\']});
google.set         


        

Answer 1

Changing the date format (mm/dd/yyyy vs. yyyy-mm-dd) seems to get it to align...

google.load('visualization', '1', {
    packages: ['corechart']
});
google.setOnLoadCallback(drawChart);

function drawChart() {

    var data = new google.visualization.DataTable();
    data.addColumn('date', 'date');
    data.addColumn('number', 'view');

    data.addRows([
        [new Date('08/01/2015'), 5],
        [new Date('08/02/2015'), 7],
        [new Date('08/03/2015'), 2],
        [new Date('08/04/2015'), 16],
        [new Date('08/05/2015'), 3],
        [new Date('08/06/2015'), 6],
        [new Date('08/07/2015'), 1]

    ]);


    var options = {
        title: 'view count',
        width: 900,
        height: 500,
        hAxis: {
            format: 'MM-dd',
            gridlines: {
                count: 90
            }
        },
        vAxis: {
            minValue: 0,
            gridlines: {
                color: '#f3f3f3',
                count: 6
            }
        }
    };

    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));

    chart.draw(data, options);
}

<script src="https://www.google.com/jsapi"></script>
<div id="chart_div"></div>