Google AJAX Feed API、簡単にフィードを描画できるクラスを追加

Google AJAX Feed APIに「FeedControl」というクラスが追加された。

　Google AJAX Feed APIに「FeedControl」というクラスが追加された。

　このクラスを利用すると、取得したフィードをWeb上に描画する際、定型的なフォーマットで簡単に表示させることができる。下はCodeZineとMarkeZineのRSSをタブ形式で表示させたサンプルだ。

Loading...

ソースコード

　ソースコードは以下の通り。

<script type="text/javascript" 
       src="http://www.google.com/jsapi?key=取得したKey"></script>
<div id="feedControl">Loading...</div>
<script type="text/javascript">
google.load("feeds", "1");
function initialize() {
  var feedControl = new google.feeds.FeedControl();
  feedControl.addFeed("http://codezine.jp/rss/new/20/index.xml", 
                      "CodeZine");
  feedControl.addFeed("http://markezine.jp/rss/new/20/index.xml", 
                      "MarkeZine");
  feedControl.draw(
    document.getElementById("feedControl"), 
    {
      drawMode : google.feeds.FeedControl.DRAW_MODE_TABBED
    });
}
google.setOnLoadCallback(initialize);
</script>

　表示形式は他にもベーシックモードやサイドバーモードなどが用意されている。なお、フィードの描画はCSSを使ってデザインすることが可能。詳細は下記Webサイト参照のこと。

参考サイト
Google AJAX Search API Blog：Introducing the AJAX Feed API FeedControl
Class Reference：FeedControl

CodeZine：Google AJAX Feed API公開、サンプル「AJAX Tune Bar」の作り方