Using Google Charts to show Data Point Values

Like most of us, in order to quickly use Google Charts Library, I copy pasted a simple code from https://code.google.com/apis/ajax/playground/?type=visualization#line_chart, adjusted to my use.

I wanted a Line Graph, with two data lines,  hours(1-24) on x axis and a number on y axis. This example was easy to customize , and most of my work was done(Please note- Most of it)

Now, I only wanted to show data values in the graph. As you can see, a tooltip pops up, when we hover on data points, I wanted tooltips or data values to show without the hover action.

The only way I could find was here - http://stackoverflow.com/questions/13449467/google-charts-api-always-show-the-data-point-values-in-graph

It says - data.addColumn({type: 'string', role: 'annotation'});


Now this is new, whats data? On going through the docs, I found that I have been using a method arraytoDataTable() [here] .This is a shortcut method to add data to graph. There is a DataTable class which has methods

• addColumn
• addRow
• addRows

See here  

this data in the above code, is the instance of the DataTable class. Now coming back to the same problem, in order to add annotation, we added the columns with role: annotation. Roles can be read here.

So now, I am able to see , the not so beautiful , annotations. 

What could be made better - Examples should be added for showing annotations. Currently there are none.