无法在Javascript中使用Google API显示实际图表

时间:2017-04-05 15:26:01

标签: javascript graph google-visualization linechart google-chartwrapper

我正在使用Google API显示图表,我正在获取图表,但它没有在图表中显示该行,

这是我正在尝试的代码,我正在使用图表的数组数据

 var jsonlength = data.feed.entry.length;
 var timestamp = new Array(jsonlength);
 var temperature = new Array(jsonlength);
 var tempid = new Array(jsonlength);

 for (var i = 0; i < jsonlength; i++) {
    timestamp[i] = ((data.feed.entry[i].gsx$timestamp.$t)); 
    temperature[i] = ((data.feed.entry[i].gsx$temperaturevalue.$t)); 
}

google.charts.load('current', {packages: ['corechart', 'line']});
google.charts.setOnLoadCallback(drawBasic);

function drawBasic() {
      var data = new google.visualization.DataTable();
      data1.addColumn('number', 'X');
      data1.addColumn('number', 'X');


    for (var i = 0; i < jsonlength; i++) {
        console.log(i);
        data1.addRows(i,data.feed.entry[i].gsx$temperaturevalue.$t);
        //Here I can display all those values, But still not getting the chart, Though I have given proper values, Help me here 
        console.log(data.feed.entry[i].gsx$temperaturevalue.$t);
    }         
      var options = {
        hAxis: {
          title: 'Date'
        },
        vAxis: {
          title: 'Temperature'
        }
      };
      var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
      chart.draw(data1, options);

这是我没有线路的输出,请帮助我,我是新手

Output without a line in the graph

1 个答案:

答案 0 :(得分:0)

很可能是由'string'值与number

造成的

试试这个......

temperature[i] = (parseFloat(data.feed.entry[i].gsx$temperaturevalue.$t));

这里......

for (var i = 0; i < jsonlength; i++) {
  timestamp[i] = ((data.feed.entry[i].gsx$timestamp.$t)); 
  temperature[i] = (parseFloat(data.feed.entry[i].gsx$temperaturevalue.$t));
}

编辑

在这里,您创建了data

  var data = new google.visualization.DataTable();

但是你要将列添加到data1 ???

  data1.addColumn('number', 'X');
  data1.addColumn('number', 'X');

尝试同步变量名称并检查下面的addRow ...

  var data1 = new google.visualization.DataTable();
  data1.addColumn('number', 'X');
  data1.addColumn('number', 'X');


for (var i = 0; i < jsonlength; i++) {

    // use addRow -- which takes an array
    data1.addRow([i,data.feed.entry[i].gsx$temperaturevalue.$t]);

}         

  var options = {
    hAxis: {
      title: 'Date'
    },
    vAxis: {
      title: 'Temperature'
    }
  };

  var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
  chart.draw(data1, options);