nni's blog

サイドバーにみんごる5のステータスを増やしました。
ちょっと思い立ってぐぐってみたところ、spreadsheetからAPIでデータが抜けるようだったので、javascriptを利用してデータを抜き出して表示しています。

面白いことにSQLが使えて、この場合は
select A,B,C,D,E,F where I="nni"
みたいな感じです。日本語文字列はNGということだったのでI列に nni というデータを埋めておいて、そこでマッチさせてます。

(参考)
・Google Spreadsheets を簡易 SQL DB に！「Google Visualization API」
・Google Visualization API 詳細、および Gadgets-in-Docs の作り方 (2件、WebOS Goodies)
ここのサンプルコードほとんどそのままです。
以下、私のコードを参考まで。(相変わらずひどい付けたし方ですｗ

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
 
<script type="text/javascript">
google.load("visualization", "1");

var dataSource = 'http://spreadsheets.google.com/tq?key=pyV2Dr02ZFvnxrR27NMXqew&gid=0&pub=1';
 
var queryLanguage = 'select A,B,C,D,E,F where I="nni"';
 
google.setOnLoadCallback(function() {
  var query = new google.visualization.Query(dataSource);
  query.setQuery(queryLanguage);
  query.send(handleResponse);
});

function handleResponse(response)
{
  var el = document.getElementById('result');
  if(response.isError()) {
    el.innerHTML = escapeHtml(response.getDetailedMessage());
    return;
  }
 
  var data = response.getDataTable();
  var html = [];
  for (var row = 0; row < data.getNumberOfRows(); row++)
  {
    var line = [];
    for (var col = 0; col < data.getNumberOfColumns(); col++)
      line.push(escapeHtml(data.getFormattedValue(row, col)));
    html.push('<tr><td>' + line.join("</td><td>") + '</td></tr>');
  }
  el.innerHTML = '<table border="1"><tr><td></td> <td></td><td>参加数< /td><td>勝数</td><td>準 </td><td>入</td>< /tr>' + html.join('') + '</table>';
}
 
function escapeHtml(text) {
  return (text || '').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/\u0022/g, '&quot;');
}

</script>
 
<div id="result">読み込み中...</div>