谷歌图表显示错误的图表

时间:2014-09-17 12:30:53

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

你好以下的人是我的谷歌图表代码......

  // Load the Visualization API and the piechart package.
  google.load('visualization', '1.0', {'packages':['corechart']});

  // Set a callback to run when the Google Visualization API is loaded.
  google.setOnLoadCallback(drawChart);

  function drawChart() {

  var data = [["00:00:00",60,0.01,0.01],
              ["00:01:00",58,0.01,0.01],
              ["00:02:00",56,0.01,0.01],
              ["00:03:00",55,0,0],
              ["00:04:00",54,0,0],
              ["00:05:00",53,-0.01,-0.01],
              ["00:30:00",53,-0.01,-0.01]];

  for(var i=0; i<data.length; i++){

      var temp1 = data[i][0].split(':');

      for(var j=0; j<temp1.length; j++){
          var temp2 = parseInt(temp1[j].replace(/^0/, ''),10);
          temp1[j] = temp2;
      }
      temp1.push(0);
      data[i][0] = temp1;
  }

  var dataTable = new google.visualization.DataTable();
  dataTable.addColumn('timeofday', 'Period');    
  dataTable.addColumn('number', 'SOC');
  dataTable.addColumn('number', 'Control Signal');
  dataTable.addColumn('number', 'Charge/discharge');

  dataTable.addRows(data);


  var dataView = new google.visualization.DataView(dataTable);

  var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
  var options = {
                    title: 'Charge Discharge Management',
                    curveType: 'function',
                    series: {0: {targetAxisIndex:0},
                             1: {targetAxisIndex:1}, 
                            }
                };
  chart.draw(dataView, options);
}

data中的上述代码中Control SignalCharge/discharge的值几乎相同,那么为什么图形线不同? Charge/discharge黄线......从右轴绘制..我们如何从左轴绘制?请帮我解决这个问题......

Fiddle link

1 个答案:

答案 0 :(得分:0)

你错过了黄色系列:

series: {0: {targetAxisIndex:0},
         1: {targetAxisIndex:1},
         2:{targetAxisIndex:1} // add this
         }