我已经开始使用谷歌最近推出的甘特图,这对于通过图表跟踪任务非常有用。
我创建了4个任务并且图表加载正常,但它显示错误的日期,例如2016年1月开发产品和发布部分。实际上我根本没有在我的数据中使用这个日期。这边有什么问题?
这是我的代码:
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>
google.charts.load('current', {'packages':['gantt']});
google.charts.setOnLoadCallback(drawChart);
function daysToMilliseconds(days) {
return days * 24 * 60 * 60 * 1000;
}
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Task ID');
data.addColumn('string', 'Task Name');
data.addColumn('date', 'Start Date');
data.addColumn('date', 'End Date');
data.addColumn('number', 'Duration');
data.addColumn('number', 'Percent Complete');
data.addColumn('string', 'Dependencies');
data.addRows([
['Design', 'Design and analysis',
new Date(2015, 8, 1), new Date(2015, 8, 15), null, 25, null],
['Development', 'Develop the product',
new Date(2015, 8, 16), new Date(2015, 10, 31), null, 20, null],
['Testing', 'Product testing',
new Date(2015, 11, 01), new Date(2015, 11, 30), null, 10, null],
['Release', 'Release the product',
new Date(2015, 12, 01), new Date(2015, 12, 20), null, 0, null],
]);
var options = {
height: 275
};
var chart = new google.visualization.Gantt(document.getElementById('chart_div'));
chart.draw(data, options);
}
答案 0 :(得分:3)
月份数字在JavaScript中基于零
2015年12月1日将是 - &gt; new Date(2015, 11, 01)
而12
将日期推迟到2016年1月1日
请参阅以下摘要...
日期测试
console.log(new Date(2015, 11, 01));
console.log(new Date(2015, 12, 01));
&#13;
图表测试
如果范围应该是8月 - 12月,那么每个月减少#1
google.charts.load('current', {'packages':['gantt']});
google.charts.setOnLoadCallback(drawChart);
function daysToMilliseconds(days) {
return days * 24 * 60 * 60 * 1000;
}
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Task ID');
data.addColumn('string', 'Task Name');
data.addColumn('date', 'Start Date');
data.addColumn('date', 'End Date');
data.addColumn('number', 'Duration');
data.addColumn('number', 'Percent Complete');
data.addColumn('string', 'Dependencies');
data.addRows([
['Design', 'Design and analysis',
new Date(2015, 7, 1), new Date(2015, 7, 15), null, 25, null],
['Development', 'Develop the product',
new Date(2015, 7, 16), new Date(2015, 9, 31), null, 20, null],
['Testing', 'Product testing',
new Date(2015, 10, 01), new Date(2015, 10, 30), null, 10, null],
['Release', 'Release the product',
new Date(2015, 11, 01), new Date(2015, 11, 20), null, 0, null],
]);
var options = {
height: 275
};
var chart = new google.visualization.Gantt(document.getElementById('chart_div'));
chart.draw(data, options);
}
&#13;
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>
&#13;