Silverlight 2で.NET技術をカッコよく使おう(5)
最新の画像処理技術PhotosynthとDeepZoomを使う
インフラジスティックス・ジャパン株式会社
デベロッパー エバンジェリスト 山田 達也
2009/7/9
連載「.NETを知らない人でも分かるSilverlight入門」の続編のSilverlight 2入門連載です。Silverlightで.NET技術をよりカッコよく簡単に使えるRIAを作ってみましょう。Silverlightそのものについて詳しく知りたい読者は、本稿と併せて特集「Silverlightは次世代のJavaScriptフレームワーク?」もご参照ください(編集部)
画像処理技術に革命を起こした「DeepZoom」
今回は、連載タイトル「.NET技術をカッコよく使おう!」の趣旨に立ち返って、Silverlightの面白い画像処理技術に注目してみます。まずはSilverlight 2で導入された「DeepZoom(ディープ・ズーム)」機能をおさらいしてみましょう。
DeepZoomは簡単にまとめると、複数の画像を奥行きのある空間上に配置し、マウスやキーボードによるスクロールや拡大・縮小といったズーミングなどの操作に対してシームレスな画像表示を行う機能です。これは、もともと「SeaDragon」という名前でプロジェクトが進められ、Silverlight 2の登場とともにDeepZoomという名前に変わりました。
すでに発表からしばらく時間が経ち、いろいろなWebサイトで活用されています。下記にDeepZoomの特徴がよく分かる代表的なWebサイトの例をピックアップしたので、まずはこれらを体験してみてください。
- Hard Rock Memorabilia
米国Hard Rock Cafeの所有するさまざまなアイテムを閲覧できる - PLAYBOY Archive
PLAYBOY誌の創刊以来過去50年以上のアーカイブが見られるというちょっと刺激的な情報コンテンツ - Project UX
双眼鏡を覗いてパスワードを探し出せ!DeepZoomをゲームのように使ったサイト
すでにDeepZoomについてはいくつも記事が紹介されているので、もう皆さんにはおなじみの技術かもしれません。技術の特徴とコード例については、以下の記事で詳しく解説されていますので、本稿と併せて参照してください。
コードを書かずにDeepZoomを手軽に試せるサービス
DeepZoomを使ったアプリケーションを開発するためには、「DeepZoomComposer」などのツールを使って画像の配置を行い、その情報をSilverlightアプリケーション上で使用する必要があります(詳しい手順は前述の特集記事にあるので、ここでは割愛します)。
一方で、コードを1行も書かなくてもDeepZoomを体験できる「DeepZoomPix」というWebサービスが公開されています。DeepZoomPixでは好きな画像を直接アップロードしたり、またはFlickrやFacebookなどのWeb上の画像サービスからインポートすることで、Web上に自分だけのアルバムを作成できます。
図1 DeepZoomPixを使うと、自分の画像アルバムをDeepZoomで表現できる(利用にはWindows Live IDが必要。また、2009年12月31日でサービス終了とアナウンスされている) |
図2 アップロードした画像をアルバム単位で管理し、いろいろなビューでサムネイルを一覧。そのままDeepZoomの機能でそれぞれの画像にズームインできる(画像をクリックすると、拡大します) |
このDeepZoomPixはSilverlightをフロントエンドに利用している以外にも、Windows Azureをデータストレージとして利用している点でクラウド・アプリケーションとしても興味深い事例です。
また、DeepZoomPixのエンジン部分は、日本企業セカンドファクトリーが開発した「JellyFish」という開発ツールキットを利用して作成されており、JellyFish自体もCodePlex上でオープンソースとして公開されているので、技術的な学習素材としても大変有用なプロジェクトといえます。
次ページでは、DeepZoomをSilverlightアプリで使う有用なテクニックをサンプルで解説し、手軽にバーチャル世界を作れるアプリ「Photosynth」を紹介します。
1-2-3 |
INDEX | ||
Silverlight 2で.NET技術をカッコよく使おう(5) 最新の画像処理技術PhotosynthとDeepZoomを使う |
||
Page1 画像処理技術に革命を起こした「DeepZoom」 コードを書かずにDeepZoomを手軽に試せるサービス |
||
Page2 DeepZoomをSilverlightアプリで使う有用テク 手軽にバーチャル世界を作れるアプリ「Photosynth」 |
||
Page3 Photosynthをインストールして使ってみよう 最新の画像処理技術をWebアプリに生かしてみては |
リッチクライアント&帳票 全記事一覧へ |
- GASで棒、円、折れ線など各種グラフを作成、変更、削除するための基本 (2017/7/12)
資料を作る際に、「グラフ」は必要不可欠な存在だ。今回は、「グラフの新規作成」「グラフの変更」「グラフの削除」について解説する - GET/POSTでフォームから送信された値をPHPで受け取る「定義済みの変数」【更新】 (2017/7/10)
HTMLのフォーム機能についておさらいし、get/postメソッドなどの内容を連想配列で格納するPHPの「定義済みの変数」の中身や、フォーム送信値の取り扱いにおける注意点について解説します【PHP 7.1含め2017年の情報に合うように更新】 - PHPのfor文&ループ脱出のbreak/スキップのcontinue【更新】 (2017/6/26)
素数判定のロジックからbreak文やcontinue文の利点と使い方を解説。for文を使ったループ処理の基本とwhile文との違い、無限ループなども併せて紹介します【PHP 7.1含め2017年の情報に合うように更新】 - Spreadsheetデータの選択、削除、挿入、コピー、移動、ソート (2017/6/12)
Spreadsheetデータの選択、挿入、削除、コピー、移動、ソートに使うメソッドの使い方などを解説する
|
|