Google Spreadsheet as Data Source
As always, Google Charts first require three things: JSAPI, visualization library, and chart packages. For this time, I will use autoload feature that sets up all three requirements in one tag and speeds up page loading.
<script type="text/javascript"
src='https://www.google.com/jsapi?autoload={"modules":[{"name":"visualization", "version":"1", "packages":"corechart","table"]}]}'>
</script>
The chart below is made of the sample google spreadsheet.
google.setOnLoadCallback(drawGID);
function drawGID() {
var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');
var query = new google.visualization.Query(
'https://' + 'docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
query.send(handleQueryResponse);
}