API: 2008年5月アーカイブ
こんにちは、DreamHUBチームです。
今回は、SemantiqNode APIを利用して、特定のフォルダの中身をRSS2.0形式でFeedするプログラムのご紹介です。
URL：http://dream.jp/ubiquitous/snode/app/rss.php
パラメータ：
アクセス例：
http://dream.jp/ubiquitous/snode/app/rss.php?node=dreamhub-node
&path=/_pub/photos/
利用シーン：
URL：http://dream.jp/ubiquitous/snode/app/rss.php
パラメータ：
- node
- SemantiqNodeのノード名を指定します。
- 例：dreamhubblog-node
- path
- 公開フォルダのパスを指定します。
- 例：/_pub/photos/
アクセス例：
http://dream.jp/ubiquitous/snode/app/rss.php?node=dreamhub-node
&path=/_pub/photos/
利用シーン：
- Googleスクリーンセーバーで、SemantiqNodeから写真を呼び出し表示する。
- Googleスクリーンセーバーをダウンロードし、インストールします。http://googlesystem.blogspot.com/2007/03/google-screensaver.html
- Windows標準のスクリーンセーバー選択肢からGoogleスクリーンセーバーを選択。
- Feed設定に上記RSS用のURLを設定します。
スクリーンセーバーが起動すると・・・
こんな感じ♪
- 画像管理ソフトでRSSを登録する
- 画像ソフトやRSSリーダーなど、RSS Feedを登録できるアプリケーションを使います。
- 設定画面で、上記RSS用のURLを設定します。
- 他にも・・・
- RSS対応のフォトフレームで利用する
なんと、「SemantiqNode PhotoCGI」にコメントもいただきましたが、SONYからWiFiでスタイリッシュに接続できるフォトフレーム「VAIO VGF-CP1」も発売されるようですね。
mRSSへの対応が必要なようなので、今回のRSS2.0のフォーマットでは対応できませんが、mRSSを出力できるようにすれば楽しくなりそうです。
こんにちは、DreamHUBチームです。
【 STEP.4 : WEBカメラの画像を表示するURLの組み込み 】
今まで、デモ画面としてWebカメラとGoogleマップとマッシュアップをいろいろお見せしてきましたが、どうやっているのか教えてほしいという声を聞きますので、今回は簡単なデモページを用意し、解説したいと思います。
■デモページ
【 STEP.1 : GoogleマップのAPIキーを取得します 】
【 STEP.2 : HTMLの作成とGoogleマップAPIキーの埋め込み 】
デモページを参考に、HTMLを作成します。
このデモページは、Googleマップの上に、マーカーを設定し、クリックすると吹き出しにWebカメラの画像が表示されるというものです。
分かりやすく説明するために、非常にシンプルな構成としました。
それでは、解説していきましょう。
【 STEP.1 : GoogleマップのAPIキーを取得します 】
まず、GoogleマップのAPIを利用するには以下のページより、APIキーを取得する必要があります。これはGoogleがどのページで利用されているのか、把握をするためになります。このAPIキーが無いとGoogleマップを利用できないので、かならず取得をおこなってください。
■マップAPI
【 STEP.2 : HTMLの作成とGoogleマップAPIキーの埋め込み 】
デモページを参考に、HTMLを作成します。
STEP1で取得したGoogleマップAPIキーは、HTMLソースで言う以下の部分に埋め込みます。
【 STEP.3 : WEBカメラの画像へアクセスするURLの確認 】
Webカメラの画像を取得するために以下の形式のURLを作成します。
Webカメラの画像を取得するために以下の形式のURLを作成します。
http://snapi.dream.jp/sn/ノード名/_pub/@fbx.webcam.capture/
例：
http://snapi.dream.jp/sn/dreamhub-node/_pub/@fbx.webcam.capture/
上記を参考に、ノード名のみ自分のノード名もしくは、WebカメラがつながっているPCに設定したノード名を書き換えて利用してください。
【 STEP.4 : WEBカメラの画像を表示するURLの組み込み 】
あとは、Googleマップを使ったHTMLにWebカメラ画像のURLを組み込むのみです。
デモページでは、以下のようにしています。
ここからは、JavaScriptを使って作り込んでいきます。
"var url="として、WebカメラのURLを設定し、吹き出しの中に表示するHTML部分に組み込んでいます。
よくわからない場合は、このurl部分を書き換え、openInfoWindowHtmlの中の部分を表示したい内容に置き換えてみてください。文字の大きさを変えたり、文字数を増やしたりすると、吹き出しからはみ出たりレイアウトが崩れたりといったことがあり試行錯誤が必要かもしれませんが、ぜひおためしください。
使った感想はぜひコメントで聞かせてくださいね！
使った感想はぜひコメントで聞かせてくださいね！
DreamHUB Blog.携帯版
