API/マッシュアップニュース

2010.03.11twitterAPIを使ったマッシュアップのサンプル紹介

今巷で大流行しているtwitterとjQueryを使ってマッシュアップを作成するサンプルプログラムです。

今回はtwitterのリプライを取得するサンプルです。
まず、準備するのはjQuery本体とjquery.twitter.mentions.jsというプラグインを使用します。
それぞれダウンロードして任意のディレクトリに保存してください。
・jQuery-1.3.2
・jquery.twitter.memtion.js

twitter.mention.jsをダウンロードするとサンプルプログラム「index.html」が入っています。
ほぼ変更するところなく動作すると思いますが、ユーザーの指定箇所だけテキストボックスから指定できるようにしてみようと思います。
せっかくjQueryを使っているので、ajaxでテキストボックスの値を送信して表示するように変更しました。

【head部分】

<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="jquery.twitter.mentions.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		$('#send').click(function() { // 送信ボタンがクリックされた
			var users = new Object();
			if ($('#user').val()) {
				users = $('#user').val().split(',');
				$('#content').twitterMentions(users, {  // 引数にオブジェクトでユーザーを渡す
					avatar : true, // 画像を表示するかどうか
					maximum : 10, // 取得件数
					ulClass : 'twitter-mentions', // 表示の際のulタグのクラス指定
					odd : true, // リストを一行ごとにシマシマにするか
					oddClass : 'odd' // シマシマにするクラス指定
				});
			}
		});
	});
</script>

※jquery、twitter.mentionsのjsファイル名、パスは各自の環境に合わせてください。

【body部分】

<body>
<div id="container">
  表示したい＠リプライのユーザーを入力してね<br />
  <input type="text" name="user" id="user" value="" size="30" style="height:20px; font-size:16px;" />
  <input type="button" name="send" id="send" value="送信" />
  <br />
  <br />

  <h1>Twitter reactions</h1>
  <div id="content"></div> // データが取得できたらここに表示される
</div>
</body>

するとこんな感じに！！　デモ画面はこちら>>
サンプル画像

サイトのサイドのスペース等に表示しようとすると、ダウンロードしたファイルに含まれている画像等を
使用するとちょっと大きいかもしれませんので、デザインやレイアウトは独自のものを使用してもオモシロいですね。

以上、こんな感じであっさりとマッシュアップサイトができてしまいます。
これを機会にマッシュアップサイトをたくさん作って、WAFLを盛り上げていきたいですね！！
（最近はマッシュアップというより、クラウドっていうほうが流行ってる感じですが。。。）

若林

2009.11.19Yahoo! JAPAN インターネットクリエイティブアワード2009 決まる！

CATEGORY：API紹介, コンテスト, マッシュアップ紹介

Yahoo! JAPAN インターネットクリエイティブアワード2009の授賞式が11/18に行われました。
Yahoo! JAPAN Internet Creative Award – ヤフー株式会社 | トップ | オフィシャルチャンネル

すでに各ニュースサイトで取り上げられていますので、詳細はそちらを。
ヤフー、「インターネットクリエイティブアワード2009」発表 -BB Watch

グランプリ受賞作をはじめ、凄い作品が揃っておりますが、
waflではAPIを利用した作品に贈られる「Creative Hack賞」に注目してみます。

この賞の選考対象は以下の通り。

企業の部、一般の部エントリー作品中で、ウェブ上で公開されている
API、もしくは、それに類するウェブ上で提供される各種サービスを利用した作品です。

「Creative Hack賞」を受賞したのは、ごうだまりぽさん（株式会社鳥人間）の「ToriSat　～　国際宇宙ステーションを見よう！」です。

Google Maps上で位置を指定すると、いつ・どの方角に衛星が見られるかをシミュレートしてくれるツールです。

衛星軌道情報を元に、方角などを計算をしていると思うのですが、
使う側としては、小難しい事を考えず手軽に見られるのがうれしいですね。

ストリートビューを利用してプラネタリウム風に衛星を眺めたり
Google Earthを利用して「衛星から見た地球」を眺めたりと
見せ方に工夫が感じられます。

プラネタリウム風（軌道に合わせてカメラが移動）

衛星軌道と衛星からの眺め（軌道に合わせてカメラが移動）

また、株式会社鳥人間さんでは、APIとしてTORIck.Star (衛星軌道計算API)を提供しており、
衛星の接近情報や高度などが公開されています。

「宇宙を舞台にマッシュアップをしてみたい！」という方は利用してみてはいかがでしょうか。

滝本

2009.07.24API/マッシュアップ関連記事まとめ（7/24）

CATEGORY：API紹介, コンテスト, マッシュアップ紹介, 業界動向, 海外

7月も残すところ後1週間ですね！今月に入ってからリリースされた
APIやマッシュアップ関連の気になる記事をまとめてみました。

■7/22 [海外][API] 音楽業界誌「Billboard」がAPIを公開

Billboardが消費者サイトへと180度方向変え, APIを公開して音楽マッシュアップの多産を期待する(Tech Crunch JAPAN)
日本でも音楽チャートでおなじみの音楽業界誌「ビルボード」がAPIを公開。
アーティスト名からチャート情報を取得したりする事ができる様です。
開発者向けサイト

■7/22 [海外][API] グーグル、約10万人の「Google Wave」のパブリックベータテストを今秋実施へ(CNET JAPAN)

チャットや電子メールといったコミュニケーションを統合する、メッセージング＆コラボレーションツール「Google Wave」。
現在は一部の開発者向けにのみ提供されていますが、9月末には10万人に開放してパブリックベータテストを実施するとの事。
APIに関するドキュメントはこちら
Google Wave API – Google Code

■7/21 [API] はてなブックマーク
(開発者さま向け)マイブックマーク全文検索APIを公開しました – はてなブックマーク日記 – 機能変更、お知らせなど

はてなブックマークに登録したエントリに対して全文検索が可能になりました。
ただし、こちらは有料サービスの「はてなブックマークプラス」申込者限定となっていますのでご注意を。

■7/18 [マッシュアップ]マッシュアップアワード5開催予告サイトが公開

リクルートさんが毎年開催しているコンテスト「マッシュアップアワード」ですが、サイトが更新されないので
開催しないのかも、と思っていましたが「MA5 2009 AUTUMN」として予告サイトが公開されていました。
良いマッシュアップネタを持っている方は、ご準備を。
MA5 2009 AUTUMN

■7/7 [海外][API] Amazon APIモバイル利用は規約違反

なぜあのアプリはApp Storeから消えたのか？–Amazon APIのモバイル利用 – builder by ZDNet Japan
利用規約に書いてあるのですが、Amazonに別途書面にて承諾を得ない限り「Amazon APIはモバイルで利用出来ません」
今回はリリース後に、Amazonからの指摘でアプリケーションの配信停止をする事態となってしまったケース。
商用利用する場合は、利用規約を十分にチェックしておきたいですね。

■7/7 [マッシュアップ] Yahoo! API・Flickr API・独自クローラを駆使したグラビアアイドルまとめサイト「cee」

Yahoo! API・Flickr API・独自クローラを駆使したグラビアアイドルまとめサイト「cee」(Gigazine)
顔写真からみつかるグラビアアイドルまとめサイト「Cee」のGigazineさんによる紹介記事です。
ランキングの集計軸などに、熱いこだわりを感じさせますね。。。
cee – グラビアアイドルまとめサイト

7/8 [API]モディファイ、ミニブログ「SMART4C」で画像投稿対応。外部APIも併せて公開(ベンチャーナウ）

「ミニブログ」サービス「SMART」のAPIが公開。
Twitterを筆頭にこういったサービスが増えてきましたが、どんな住み分けがされていくんでしょうか。
SMART

以下は6月ですが、重要な更新でしたのでご紹介

■6/19 [API] Google Maps API のルート検索APIが日本国内に対応

Google Japan Blog: ルート案内 API が日本でも使えるようになりました
指定した地点間のルートがラインが引かれ、「舞浜ローズタウン前（交差点）を左折する」の様な
ルート情報を取得する事ができる様になりました。

以上、API/マッシュアップ関連記事まとめ（7/24）でした！

2009.05.29Googleのプロダクトを「とても簡単に」自分のサイトに組み込める「Google Web Elements」

CATEGORY：API紹介

5月27日と28日にサンフランシスコで、開発者向けイベント「Google I/O 2009」が開催されました。
その中で開発者にとって刺激的な発表がいくつかなされました。
イベントの詳細については、記事が充実しているニュースサイトさんなどに譲るとして、waflとして反応すべき点はもちろん
「Google Web Elements」です。

「Google Web Elements」のサイトで生成したコードを自分のサイトや
ブログに貼り付けるだけで、Googleのプロダクトを表示させる事ができます。

試しにコードを貼ってみましたので、見ていただければ一目瞭然です。
(続きを読む…)

Google Web Elements >>

2009.04.20海洋気象情報を取得できる「海快晴気象情報API」

CATEGORY：API紹介

「株式会社サーフレジェンド」さんが提供する「海快晴気象情報API」を紹介します。

気象情報を提供するAPIはいくつかありますが「海洋情報」という分野についての情報量はこちらが最も豊富です。
自身で提供するWEBサイト「サーフィンと海の総合サイト波伝説ドットコム」や「マリンウェザー海快晴」で利用している物と
同様の情報がAPIで取得できます。

特に他に無い情報として注目したいのが (続きを読む…)

海快晴気象情報API >>

1 / 5 ページ
次の5件 >

API/マッシュアップニュース

2010.03.11twitterAPIを使ったマッシュアップのサンプル紹介

2009.11.19Yahoo! JAPAN インターネットクリエイティブアワード2009 決まる！