Building line charts

The line charts are based on scatter charts. Contrary to scatter charts that show isolated correlation between two variables, the line chart tells a story in many ways; we can go back to our previous recipe, Spreading data in a scatter chart, and draw a line between the dots to create the connection. This type of chart is usually used in website statistics, tracking things over time, speed, age, and so on. Let's jump right into it and see it in action.

Getting ready

As usual get your HTML wrapper ready. In this recipe we actually are going to base our changes on the previous recipe, Spreading data in a scatter chart.

In our case study for this example, we will create a chart that shows how many new members joined my site, 02Geek.com, in 2011 and 2010. I've gathered the information month by month and gathered it into two arrays:

var a2011 = [38,65,85,111,131,160,187,180,205,146,64,212];
var a2010 = [212,146,205,180,187,131,291,42,98,61,74,69];

Both arrays have a length of...