谷歌圖表甘特錯誤

Question

在此基礎上演示

： https://jsfiddle.net/api/post/library/pure/

我試圖創建甘特圖。

這是我使用的代碼：

google.load("visualization", "1.1", {packages:["gantt"]}); 
google.setOnLoadCallback(drawGantt()); 
function drawGantt() { 
    var $ganttData = new google.visualization.DataTable(); 
    $ganttData.addColumn('string', 'Task ID'); 
    $ganttData.addColumn('string', 'Task Name'); 
    $ganttData.addColumn('string','Resource') 
    $ganttData.addColumn('date', 'Start Date'); 
    $ganttData.addColumn('date', 'End Date'); 
    $ganttData.addColumn('number', 'Duration'); 
    $ganttData.addColumn('number', 'Percent Complete'); 
    $ganttData.addColumn('string', 'Dependencies'); 

    $array.push(['0000050000000000110010002','ddd','MKT',new Date(2015,11 - 1,26),new Date(2015,11 - 1,30),daysToMilliseconds(daydiff(new Date(2015,11 - 1,26),new Date(2015,11 - 1,30))),25,null]) 
    $array.push(['0000050000000000110010001','Actividad 1','MKT',new Date(2015,11 - 1,10),new Date(2015,11 - 1,11),daysToMilliseconds(daydiff(new Date(2015,11 - 1,10),new Date(2015,11 - 1,11))),4,null]); 
    $ganttData.addRows($array); 
    var $ganttOptions = { height: 300, gantt: { trackHeight: 30 } }; 
    var $ganttChart = new google.visualization.GanttChart(document.getElementById('div-Actividades')); 
    $ganttChart.draw($ganttData, $ganttOptions); 
} 

其結果是，我有這個非認識錯誤：

此圖片是使用IE瀏覽器是Mozilla Firefox

或Chrome，這是工作正常。

Answer 1

可能是在Firefox引擎的JavaScript引擎不同於IE/Chrome，可能是new Date(2015,11 - 1,11)的格式？

看看this answer to another question。

Here is關於格式化日期的一些更有趣的閱讀。

Answer 2

提供的例子不爲我在任何瀏覽器由於以下問題開展工作：

• 因爲google.setOnLoadCallback函數需要回調函數， 你需要 google.setOnLoadCallback(drawGantt);
• $array更換google.setOnLoadCallback(drawGantt());尚未初始化，例如var $array = [];
• 以及最後但並非最不重要的，它不是一個真正的問題，但你可以設置null到Duration列時，它會自動根據Start Date和Start Date值

修改例計算

google.load("visualization", "1.1", { packages: ["gantt"] }); 
 
google.setOnLoadCallback(drawGantt); 
 

 
function drawGantt() { 
 
    var dataTable = new google.visualization.DataTable(); 
 
    dataTable.addColumn('string', 'Task ID'); 
 
    dataTable.addColumn('string', 'Task Name'); 
 
    dataTable.addColumn('string','Resource') 
 
    dataTable.addColumn('date', 'Start Date'); 
 
    dataTable.addColumn('date', 'End Date'); 
 
    dataTable.addColumn('number', 'Duration'); 
 
    dataTable.addColumn('number', 'Percent Complete'); 
 
    dataTable.addColumn('string', 'Dependencies'); 
 

 
    data = []; 
 
    data.push(['0000050000000000110010002','ddd','MKT',new Date(2015,11 - 1,26),new Date(2015,11 - 1,30),null,25,null]) 
 
    data.push(['0000050000000000110010001','Actividad 1','MKT',new Date(2015,11 - 1,10),new Date(2015,11 - 1,11),null,4,null]); 
 
    dataTable.addRows(data); 
 
    var ganttOptions = { height: 300, gantt: { trackHeight: 30 } }; 
 
    var ganttChart = new google.visualization.GanttChart(document.getElementById('div-Actividades')); 
 
    ganttChart.draw(dataTable, ganttOptions); 
 
}

<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
 
<div id="div-Actividades"></div>

The specified example works properly in Google Chrome (v46), Mozilla Firefox (v41.0) and IE 9+