Charting with JavaScript

In this section, we will look at an example of how to create interactive charts using Google Visualization's JavaScript API. The Google Visualization API provides a powerful set of functions for creating different kinds of charts, such as pie chart, line chart, bar chart, and so on. In this section, we will see, in brief, how to create them using this API.

Getting ready

Now, let's look at the basic steps to follow to use Google Visualization API to create different styles of charting. We will be looking at an example where we create a bar chart, line chart, and pie chart on the page. Now, let's go through the preliminary steps to create the chart using the Visualization API.

1. Placing a chart container:

   First of all, we need to place an HTML element in the web page that holds the chart. Typically, it should be a block-level element. Let's start with the popular block-level element <div>, as follows:

   <div id="chart"></div> 

   Please make sure you assign an...