Last Updated: February 25, 2016
·
1.484K
· imcasts

Getting Started With Google Charts

 <script type="text/javascript" src="https://www.google.com/jsapi"></script>
 <script type="text/javascript">
   google.load("visualization", "1", {packages:["corechart"]});
   google.setOnLoadCallback(drawChart);
   function drawChart() {
     var data = new google.visualization.DataTable();
     data.addColumn('string', 'Date'); // Implicit domain label col.
     data.addColumn('number', 'Your Value Title'); // Implicit series 1 data col.
     data.addRows([
        <% @array.each do |at| %>
          [<%= "'" + a.date.to_s + "'" %>, <%= a.weight %>],
        <%end%>
      ]);

      var options = {
        title: 'Your Chart Title',
        chartArea:{left:50,top:50,width:"100%",height:"70%"}
      };

      var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
      chart.draw(data, options);
    }
</script>

<div id="chart_div" style="width:100%; height: 500px;"></div>