Question

I am trying to use the Google Charts API to create a chart that has values dynamically given to it. The following code is supposed to take an array of values and populate the chart with them, but is instead hanging and killing the page. I am assuming that the for loop is not ending – but I can’t figure out what is wrong.

Any ideas?

<script type="text/javascript">
  google.load("visualization", "1", {packages:["corechart"]});
  function drawChart(values) {
    var data = new google.visualization.DataTable();
    data.addColumn('number', 'Value');
    data.addRows(values.length);

    for(i=0; i <= values.length; i+3) {
        data.setValue(values[i], values[i+1], values[i+2]);
    }

    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
    chart.draw(data, {width: 400, height: 240, legend: 'none', gridlineColor: '#fff', chartArea:{left:0,top:20}});
  }

  function stockFractal(){

  }

</script>

Answer 1

You are not incrementing the i variable in the for loop; you want i+=3 not i+3.

for (i=0; i <= values.length; i+=3)