google<\/span>.<\/span>load<\/span>(<\/span>'visualization'<\/span>,<\/span> '1'<\/span>,<\/span> {<\/span>'packages'<\/span>:<\/span>[<\/span>'annotatedtimeline'<\/span>]});<\/span> <\/div>google<\/span>.<\/span>setOnLoadCallback<\/span>(<\/span>drawGraph<\/span>);<\/span><\/div> <\/div>
function<\/span> drawGraph<\/span>()<\/span> {<\/span><\/div> <\/div>
// define the DataTable cell by cell<\/span><\/div> <\/div>
var<\/span> data<\/span> =<\/span> new<\/span> google<\/span>.<\/span>visualization<\/span>.<\/span>DataTable<\/span>();<\/span><\/div> <\/div>
// add columns and rows<\/span><\/div> data<\/span>.<\/span>addColumn<\/span>(<\/span>'date'<\/span>,<\/span>'Date'<\/span>);<\/span><\/div> data<\/span>.<\/span>addColumn<\/span>(<\/span>'number'<\/span>,<\/span>'obama'<\/span>);<\/span><\/div> data<\/span>.<\/span>addColumn<\/span>(<\/span>'string'<\/span>,<\/span>'obama_description'<\/span>);<\/span><\/div> data<\/span>.<\/span>addColumn<\/span>(<\/span>'string'<\/span>,<\/span>'obama_text'<\/span>);<\/span><\/div> data<\/span>.<\/span>addRows<\/span>(<\/span>6<\/span>);<\/span><\/div> <\/div>
// add first row for October 2008<\/span><\/div> // (remembering that a JavaScript date has a month between 0 and 11)<\/span><\/div> data<\/span>.<\/span>setValue<\/span>(<\/span>0<\/span>,<\/span>0<\/span>,<\/span>New<\/span> Date<\/span>(<\/span>2008<\/span>,<\/span>9<\/span>,<\/span>1<\/span>));<\/span><\/div> data<\/span>.<\/span>setValue<\/span>(<\/span>0<\/span>,<\/span>1<\/span>,<\/span>816<\/span>)<\/span><\/div> data<\/span>.<\/span>setValue<\/span>(<\/span>0<\/span>,<\/span>2<\/span>,<\/span>'obama - Oct 2008'<\/span>);<\/span><\/div> data<\/span>.<\/span>setValue<\/span>(<\/span>0<\/span>,<\/span>3<\/span>,<\/span>'<a href=[url1]>Liveblogging the Obama-McCain town hall debate</a><p>...</p>'<\/span>));<\/span><\/div> <\/div>
// ....[continues for 5 more rows]...<\/span><\/div> <\/div>
// Display the graph on the page<\/span><\/div> var<\/span> chart<\/span> =<\/span> new<\/span> google<\/span>.<\/span>visualization<\/span>.<\/span>AnnotatedTimeLine<\/span>(<\/span>document<\/span>.<\/span>getElementById<\/span>(<\/span>'chart_div'<\/span>));<\/span><\/div> chart<\/span>.<\/span>draw<\/span>(<\/span>data<\/span>,<\/span> {<\/span>displayAnnotations<\/span>:<\/span> true<\/span>});<\/span><\/div> <\/div>
}<\/span> <\/div><\/pre><\/div>\n \n <\/div>\n\n