デモの紹介

ここでは、Ajax, Google Maps API を使った Webアプリケーション を紹介しています。

広島っぷ

解説
Google Maps API を使ったアプリ。自作。
広島のおいしいお店を紹介している。お店は実際に行って、また来たいなと思ったもののみを厳選。
みんなのオススメのお店も登録出来るようになっているが、管理人が許可したもののみ表示される。
サーバ側ではデータベースからデータを取得し、XML で出力。
ブラウザはそれを受け取り、マップのアイコン、サブウィンドゥ、画面左のリストを表示している。
日々改善中。

FF11 装備検索

解説
Ajax を使ったアプリ。自作。
HTML, JavaScript, XML, XSLT を使用した FF11 の装備検索の革命児
サーバ側の処理は一切無し。他の装備検索と比較すると分かるが、異常な速さを誇る。
ただし、アイテムのデータが多すぎて、全てを用意出来ていない・・・
タブをクリックすることで、検索する装備品を切り替える。
タブを切り替えても検索結果は保持されているので、比較・検討に使い易い。
データは装備品の種類毎に XML (装備品データ)を用意。
Ajax でそれを取得し、XSLT で HTML へ変換している。
検索も XSLT で処理している。
日々データ作成中。

BBS

解説
画面左のリストの BBS をクリックすると表示される。
元々存在した BBS を無理やり Ajax 化させた。

その他、鋭意作成中。

以下は、非常に参考になる良質アプリを紹介。

sproutliner

解説
Ajax を使ったアプリ。
入力欄に適当に入力して、[ Enterキー ] を押すと、画面がスムーズに変化する。
その後の画面では、入力して [ Enterキー ] を押すとタイトルが追加される。
いくつか追加後、左の●をドラッグし、別のタイトルにドロップすると、階層構造になる。
new column では項目を追加出来る。項目名を消すと削除出来る。
トップ画面の下のほうで、ソースファイルのダウンロードも出来る。

ytab

解説
Ajax と Yahoo! API を使った、タブ式検索。
左上の add new search でタブが追加され、右の close でタブが閉じる。
タブを追加することで、複数の検索結果が保持され、タブを切り替えることで表示される。

ajax解説ページ

解説
Ajax を使って、Ajax の解説をしている。
結構分かり易くて、重宝した。