首页 > 解决方案 > 谷歌图表 - 无效的数据表格式:

问题描述

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 列必须是“数字”类型。×

任何人都可以说出什么是错的。

标签: chartsgoogle-visualization

解决方案


检查甘特图 的数据格式

唯一的可选列是'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>


推荐阅读