Liveガジェットの基本的なAPI解説は、これでほぼ説明したことになる。本開発詳細連載の締めくくりとして、実用的なサンプルを示そう。
ここで示すのは、画面2に示すアナログ時計のサンプルだ(リスト4、リスト5)。
リスト4:アナログ時計のマニフェスト(AnalogTime.xml)
リスト5:アナログ時計のJavaScriptコード(AnalogTime.js)
すでにJavaScriptを使った経験がある人なら分かると思うが、JavaScriptには、画面に線や円を描画するための機能がない。そしてまた、そのような機能をWindows Liveが提供しているわけでもない。
画面2に示したサンプルでは、Walter Zornの「JavaScript VectorGraphics library」を用いた。このライブラリは、divタグ要素をキャンバスに見立てて、JavaScriptから線や円などを描画できる機能を持つものだ。
Liveガジェットで、このようなライブラリを使うには、マニフェストで読み込めばよい。
リスト4に示したように、このガジェットマニフェストでは、次のように「自身のJavaScriptコード」のほかに「JavaScript VectorGraphics library」を示すitemタグ要素を指定している。
ガジェットマニフェストでは、幾つソースコードを指定しても構わない。何らかのJavaScriptライブラリを利用したい場合には、この例のようにそれぞれのソースコードを列挙すればよいのだ。
<item>
<link>
http://localhost/Gadgets/AnalogTime/AnalogTime.js
</link>
</item>
<item>
<!-- http://www.walterzorn.com/から
ダウンロードしたライブラリのパス -->
<link>
http://localhost/Gadgets/AnalogTime/wz_jsgraphics.js
</link>
</item>
上記のURLは、環境に合わせて調整することになる。ここではJavaScript VectorGraphics libraryをあらかじめダウンロードして、Liveガジェットのコードと同じ場所に置いた状態を想定している。しかし、それぞれのJavaScriptのコードが、異なるサーバに存在しても問題ない。
Copyright © ITmedia, Inc. All Rights Reserved.