Google Vis: Диаграмма Ганта с нечетными строками

Question

Попытка создающих на диаграмме Ганта, но линии нечетные:

https://jsfiddle.net/Khrys/zyfbsy67/1/

google.charts.load('current', {'packages':['gantt']}); 
google.charts.setOnLoadCallback(drawChart); 

function drawChart() { 

    var data = new google.visualization.DataTable(); 
    data.addColumn('string', 'Task ID'); 
    data.addColumn('string', 'Task Name'); 
    data.addColumn('string', 'Resource'); 
    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([ 
    ['Project', 'Project 1', null, new Date(2015, 0, 1), new Date(2015, 6, 5), null, 100, null], 
    ['Task1', 'Task 1', 'Tarefa', new Date(2015, 0, 1), new Date(2015, 2, 5), null, 20, 'Project'], 
    ['Task2', 'Task 2', 'Tarefa', new Date(2015, 2, 1), new Date(2015, 3, 5), null, 60, 'Project'], 
    ['Task3', 'Task 3', 'Tarefa', new Date(2015, 4, 1), new Date(2015, 5, 5), null, 40, 'Project'] 
    ]); 

    var options = { 
    height: 475 
    }; 

    var chart = new google.visualization.Gantt(document.getElementById('chart_div')); 

    chart.draw(data, options); 
} 

Answer 1

данные вы поставляете на графике должна быть исправлена.
Все задачи зависят от общего проекта, который заканчивается после всех Заданий.
Вы можете удалить зависимости или сократить дату окончания проекта до конца первой задачи.

google.charts.load('current', {'packages':['gantt']}); 
 
google.charts.setOnLoadCallback(drawChart); 
 

 
function drawChart() { 
 

 
    var data = new google.visualization.DataTable(); 
 
    data.addColumn('string', 'Task ID'); 
 
    data.addColumn('string', 'Task Name'); 
 
    data.addColumn('string', 'Resource'); 
 
    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([ 
 
    ['Project', 'Project 1', null, new Date(2015, 0, 1), new Date(2015, 6, 5), null, 100, null], 
 
    ['Task1', 'Task 1', 'Tarefa', new Date(2015, 0, 1), new Date(2015, 2, 5), null, 20, null], 
 
    ['Task2', 'Task 2', 'Tarefa', new Date(2015, 2, 1), new Date(2015, 3, 5), null, 60, null], 
 
    ['Task3', 'Task 3', 'Tarefa', new Date(2015, 4, 1), new Date(2015, 5, 5), null, 40, null] 
 
    ]); 
 

 
    var chart = new google.visualization.Gantt(document.getElementById('chart_div')); 
 

 
    chart.draw(data, {}); 
 
    
 
    drawChart2(); 
 
} 
 

 
function drawChart2() { 
 

 
    var data = new google.visualization.DataTable(); 
 
    data.addColumn('string', 'Task ID'); 
 
    data.addColumn('string', 'Task Name'); 
 
    data.addColumn('string', 'Resource'); 
 
    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([ 
 
    ['Project', 'Project 1', null, new Date(2015, 0, 1), new Date(2015, 0, 9), null, 100, null], 
 
    ['Task1', 'Task 1', 'Tarefa', new Date(2015, 0, 1), new Date(2015, 2, 5), null, 20, 'Project'], 
 
    ['Task2', 'Task 2', 'Tarefa', new Date(2015, 2, 1), new Date(2015, 3, 5), null, 60, 'Project'], 
 
    ['Task3', 'Task 3', 'Tarefa', new Date(2015, 4, 1), new Date(2015, 5, 5), null, 40, 'Project'] 
 
    ]); 
 

 
    var chart = new google.visualization.Gantt(document.getElementById('chart_div2')); 
 

 
    chart.draw(data, {}); 
 
}

<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="chart_div"></div> 
 
<br/> 
 
<div id="chart_div2"></div>