谷歌图表-无效的数据表格式:

时间:2018-08-02 02:32:09

标签: charts google-visualization

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.addRows([
    ['2014Spring', 'Spring 2014', 'spring',new Date(2014, 2, 22), new Date(2014, 5, 20)]]);  
    var options = {
    height: 400,
    gantt: {
      trackHeight: 30
    }
  };

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

  chart.draw(data, options);
}
</script>

输出 无效的数据表格式:第5列的类型必须为“数字”。×

任何人都可以分辨出什么问题

1 个答案:

答案 0 :(得分:1)

检查data format的甘特图

唯一可选的列是'Resource'
所有其他列都是必需的

您不必为这些列提供值,

  data.addRows([
    [
      '2014Spring',           // Task ID
      'Spring 2014',          // Task Name
      'spring',               // Resource ID (optional)
      new Date(2014, 2, 22),  // Start
      new Date(2014, 5, 20),  // End
      null,                   // Duration (in milliseconds)
      null,                   // Percent Complete
      null                    // Dependencies
    ]
  ]);  

但它们必须存在于数据表中

请参阅以下工作片段...

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', '% Complete');
  data.addColumn('string', 'Dependencies');

  data.addRows([
    ['2014Spring', 'Spring 2014', 'spring',new Date(2014, 2, 22), new Date(2014, 5, 20), null, null, null]
  ]);  

  var options = {
    height: 400,
    gantt: {
      trackHeight: 30
    }
  };

  var chart = new google.visualization.Gantt(document.getElementById('chart_div'));
  chart.draw(data, options);
}
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>