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);
}
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.