If ya haven't checked out google charts check them out, there pretty good.

So you want to graph some stuff, but you dont have data for every point on the X axis, what do ya do. You dont do this. Its wrong. The distance between 1997 - 2005 is the same as between 2005 - 2006, giving different meaning to the graph


So what can ya do to get around it. You put in lots of null values inbetween the data points you have and configure the chart to interpolate those nulls. This would be too tedious to be a valid solution but with the addRows & setValues method the code turns out alright.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Year');
data.addColumn('number', 'Sales');
data.addRows(10);
data.setValue(0, 0, '1997');
data.setValue(0, 1, 1000);
data.setValue(7, 0, '2005');
data.setValue(7, 1, 1170);
data.setValue(8, 0, '2006');
data.setValue(8, 1, 860);
data.setValue(9, 0, '2007');
data.setValue(9, 1, 1030);
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data,{width:400, height:240, title:'Company Performance', interpolateNulls:true});

Yay we have our chart, but all those nulls must be a bad thing. It probably using a flat array, that is truly full of nulls, giving a nasty hit to the performance. A quick look with the chrome dev tools confirms this.

First a chart with 10 rows

Second a chart with 1000 rows

So its 100 times worse taking almost a second. Not good enough, what about when i want to a resolution of 10,000 points.