google.setOnLoadCallback(drawChart);
function drawChart() {
var container = document.getElementById("role_history");
var chart = new google.visualization.Timeline(container);
var dataTable = new google.visualization.DataTable();
dataTable.addColumn({ type: 'string', id: 'Role' });
dataTable.addColumn({ type: 'string', id: 'Office' });
dataTable.addColumn({ type: 'date', id: 'Start' });
dataTable.addColumn({ type: 'date', id: 'End' });
dataTable.addRows([
["Sales Associate","Los Angeles", new Date(2014,10,13), new Date(2014,10,15) ],
["Manager","Los Angeles", new Date(2013,10,12), new Date(2014,1,1) ]
]);
var formatter_short = new google.visualization.DateFormat({formatType: 'short'});
formatter_short.format(dataTable, 2);
formatter_short.format(dataTable, 3);
var options = {
// Set the height to the number of rows (times row height) + the date label height
height: 2 * 41 + 50},
timeline: { singleColor: '#1E90FF' }
}
chart.draw(dataTable, options);
}