“ Google has introduced its own jquery charts coding, which is easy to implement and fast loading. Have a look at this Google Chart Options. Google Charts having 20+ Chart type like Area Charts, Bar Charts, Calendar Charts, Column Charts, Geo Charts, Line Charts, Pie Charts, etc. Here in the below coding, three columns are available Year, Sales and Expense. Below Coding will represent Line Chart, Chart type is mention in this line ”

var chart = new google.visualization.LineChart(document.getElementById(‘chart_div’));

Sample Google Chart Coding.

<html>
<head>
<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 = google.visualization.arrayToDataTable([
[‘Year’, ‘Sales’, ‘Expenses’],
[‘2008’, 130, 590],
[‘2009’, 380, 640],
[‘2010’, 530, 740],
[‘2011’, 430, 840],
[‘2012’, 1230, 940]
]);

var options = {
title: ‘Company Performance’
};

var chart = new google.visualization.LineChart(document.getElementById(‘chart_div’));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id=”chart_div” style=”width: 900px; height: 500px;”></div>
</body>
</html>