Revisiting lines: making the line chart interactive
In this recipe, we will travel back in time to one of our earlier recipes, Building line charts in Chapter 3, Creating Cartesian-based Graphs and add some user control to it. This control enables the user to turn on and off the streams of data.
Getting ready
The first step that you will need to take is to grab the source code from Chapter 3, Creating Cartesian-based Graphs. We will rename 03.05.line-revamp.html and 03.05.line-revamp.js to 05.02.line-revisit.
Now that we have our files up to date, add our HTML file—three radio groups to represent the three data sources (years 2009, 2010, and 2011).
<hr/>
2009 : <input type="radio" name="i2009" value="-1" /> off
<input type="radio" name="i2009" value="0" /> line
<input type="radio" name="i2009" value="1" select="1" /> full<br/>
2010 : <input type="radio" name="i2010" value="-1" /> off
<input type="radio" name="i2010" value="0" /> line...
