简体   繁体   中英

Google timeline chart starting from wrong date

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

  function drawChart() 
  {
    var container = document.getElementById('chart_div');
    var chart = new google.visualization.Timeline(container);
    var dataTable = new google.visualization.DataTable();

    dataTable.addColumn({ type: 'string', id: 'DMAIC' });
    dataTable.addColumn({ type: 'string', id: 'Pozicija' });
    dataTable.addColumn({ type: 'string', 'role': 'tooltip', 'p': {'html': true}})
    dataTable.addColumn({ type: 'date', id: 'Start' });
    dataTable.addColumn({ type: 'date', id: 'End' });
    dataTable.addRows([['Opredelitev', 'Plan' , '<div class="timelineHover"><p style="padding:2px;font-weight:bold;">10.12.2015 - 19.12.2015</p></div>', new Date(2015, 12, 10), new Date(2015, 12, 19)],['Meritev', 'Plan' , '<div class="timelineHover"><p style="padding:2px;font-weight:bold;">09.12.2015 - 16.01.2016</p></div>', new Date(2015, 12, 09), new Date(2016, 01, 16)],['Analiza', 'Plan' , '<div class="timelineHover"><p style="padding:2px;font-weight:bold;">18.12.2015 - 24.12.2015</p></div>', new Date(2015, 12, 18), new Date(2015, 12, 24)],['Izboljšava', 'Plan' , '<div class="timelineHover"><p style="padding:2px;font-weight:bold;">12.01.2016 - 23.01.2016</p></div>', new Date(2016, 01, 12), new Date(2016, 01, 23)],['Kontrola', 'Plan' , '<div class="timelineHover"><p style="padding:2px;font-weight:bold;">07.01.2016 - 23.01.2016</p></div>', new Date(2016, 01, 07), new Date(2016, 01, 23)],['Replikacija', 'Plan' , '<div class="timelineHover"><p style="padding:2px;font-weight:bold;">08.02.2016 - 26.02.2016</p></div>', new Date(2016, 02, 08), new Date(2016, 02, 26)],['Opredelitev', 'Realizacija', '<div class="timelineHover"><p style="padding:2px;font-weight:bold;">17.12.2015 - 25.12.2015</p></div>', new Date(2015, 12, 17), new Date(2015, 12, 25)]]);

    var options = {
        width:950,
        height:430,
        backgroundColor: '#ffd',
        timeline: { colorByRowLabel: true },
        tooltip: {isHtml: true}
    };
    chart.draw(dataTable, options);
  }

http://jsfiddle.net/r37uf/50/

In this example my earliest value starts with

new Date(2015, 12, 9)

That should be 9th of December, but my chart starts with 9th of January.

A Month, in Date format is month number - 1 , so you should use new Date(2015, 11, 9) for December.

January is month 0, or default month if incorrect is provided (12 is incorrect)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM