JREが原因の字化けその後…2012-02-09

前回の記事ではCentOS6.0xでの記事だったのですが、先日いじりすぎて再起不能となってしまい昨日6.2をインストールしました。で早速環境を再構築していたらXMLmindが初期状態で日本語入力できるでないか…と思ったら”権”などいろいろ字化けしてしまう文字がある。何か変更が入ってる?

/usr/share/fonts/を見てみたらIPAフォントがあるでないかい!6.0でもすでにあったのかな?当時あわててたので確認しなかったのですが、実際どうだったんでしょう?

デフォルトで読み込むfontconfig.RedHat.6では、VL_Gothicを指定しているようですが、VL_Gothic自体はあるし、この部分をIPAにしてもうまく直りません。結果オーライのontconfig.properties.srcで今回も使うことにします。

以下がCentOS6.2の環境で変更したfontconfig.properties.srcの内容。(この下の記事も要併読)


#filename.Sazanami_Gothic=/usr/share/fonts/japanese/TrueType/sazanami-gothic.ttf
filename.Sazanami_Gothic=/usr/share/fonts/ipa-gothic/ipag.ttf
#filename.Sazanami_Mincho=/usr/share/fonts/japanese/TrueType/sazanami-mincho.ttf
filename.Sazanami_Mincho=/usr/share/fonts/ipa-mincho/ipam.ttf

CakePHP2.0でもTransitionが使えた

いろいろと頭を悩ます確認画面の実装法ですが、できるだけ簡便に済ませる方法を探したら、Transitionコンポーネントが良さそう。http://d.hatena.ne.jp/hiromi2424/20100617/1276757385

てことで、早速 http://blog.fusic.co.jp/archives/213 の例を元にまず1.3で動作確認してからCakePHP2.04にセットしてみました。TransitionComponentクラスの継承元はObjectからComponentに替える必要がありますが、それだけで難なく動作しました。作者のhiromi2424さんに感謝です。

フレームワークで迷走

PHPフレームワークを本格的(?)に勉強するのは初めてなのですが、数あるフレームワークのなかでCakePHPを参考文献とプラグインの多さで魅力を感じてコレに決めました。ほかにCodeIgniterが簡単で速くて、自分なりのアレンジができそうなので魅力的だったのですがライセンスの関係で断念しました。

で、さっそく環境を作ってCakePHPをインストールしてチュートリアルを実行したのですが、ACLでつまずきました。実現できればガシガシとコードを書かなくて済みそうなのでその分助かります。でも期待した通りには動きません。たぶんどこかに自分のミスがあるのだろう・・・バージョンも2.03から資料の多い1.3にしてみたもののやはりうまくいかず、かといってソースを順を追って読むのも面倒くさい。で、いろいろ検索したら解決の糸口をみつけました。

http://works-bb.net/2009/02/12/337.html ありがたいです。ちょっとしたところでミスしてるのに気付きました。ミスの箇所を修正したらバッチリアクセス制御できました。http://www.alaxos.ch/blaxos/pages/view/plugin_aclACLプラグインも視覚的にパーミッション設定ができて便利です。感謝!

その後CakePHP2.0でもACLチュートリアルACL Pluginもクリアできました。バージョン2でも一番面倒くさそうな部分をクリアできたのでこのまま2でいこうと思う。

ちなみに、http://book.cakephp.org/2.0/en/tutorials-and-examples/simple-acl-controlled-application/part-two.htmlに記されてるAclExtrasのプラグイン、downloaded in で示されているリンクからダウンロードすれば問題ないですが、githubのサイト(https://github.com/markstory/acl_extras/tree/2.0)に行ってdownloadタブをクリックした先でダウンロードすると古いバージョン(CakePHP1.3用かな?)なので実行できません。タブでなくZIPのボタンをクリックすればOK。素直に指示通りのリンク先からDLすれば良かった。無駄な時間を浪費したトホホ。

3年ぶりの投稿 [その他]

石の上にも3年といいますが、このブログの最後の記事から3年以上経過してしまいました。

早いですねー3年 光陰矢のごとしとはよく言ったものです。

で、今後はしばらくの間備忘録的な内容に変更させていただきます。過疎ってきたことですし・・・

普通のデジカメで3Dパノラマを作成する(その3)


3Dパノラマの作例:Bipolarモード3Dパノラマの作例:Globeモード3Dパノラマの作例:Sphereモード
 パノラマFlashビューアーのウェブでの公開については「360度パノラマ画像をFlashビューアーで表示させる」でも触れました。でも今回はその本領を発揮する一番おいしい部分です。Huginで出力したEquirectangular(正距円筒)投影の全方位画像による3Dパノラマは、一枚の元画像でいろんな表示パターンで遊べるので少し詳しく解説したいと思います。必要となる知識としては、少しでもご自分でホームページを作ったことのある方であれば充分OKです。具体的にはファイルをアップロードして公開するためのウェブサーバーが要ります、またそのためのHTML編集やアップロードするためのFTPソフト(またはウェブアップローダー)に関する知識が必要となります。ちなみにここでは.swf、.html、.jpg、.jsファイルは全て同一フォルダに置くという前提で解説しています。

 使用するFlashビューアーはRyubin氏作のビューアーを使わせていただきます。Ryubin's Flash Panoramaのダウンロードページhttp://ryubin.com/PanoGallery/download.htmlからダウンロードします。Ryubin'sFlashPanoramaKit_071220.zipを解凍するといくつかの.swfファイルがありますが、ここではPanoSphereFlash_v10.swfを使います。
※ココで使用しているRyubin's Flash Panoramaのファイルは2008年1月時点のものです。Ryubin氏のサイトで現在ダウンロード可能な最新バージョンのファイルとは差異がある可能性あり、設定内容にも違いがあるかもしれません。最新バージョンでのご使用&設定をお勧めいたします。

Ryubin'sFlashPanoramaKit を使ってパノラマ画像を公開しているページ(リンク先募集中!)

http://pasokon-maruya.cocolog-nifty.com/blog/ ← 和歌山県の古座川を愛する方のブログ

読み込ませる画像サイズについて

読み込み画像の比較 Flashが読み込めるイメージの大きさが最大2880ピクセルなので、PanoSphereFlashで表示する場合2:1のアスペクト比の画像では最大2880×1440ピクセルとなります。今回の800×600ピクセルの画像を使って全方位画像を作成すると5170×2585ピクセルでしたが、PanoSphereFlashで表示するには2880×1440ピクセルに縮小しなければなりません。

 しかし使用する画像のサイズが小さいと、ズームアップしたときの荒さが目立つようになります。できるだけ細部まできれいに見せたい場合は、最大限大きな画像を読み込ませる必要があります。Ryubin氏のサイトをお読みになっている方はご存知だと思いますが、そのための機能として、アスペクト比1:1の最大2880×2880ピクセルを読み込ませて表示することができます。この違いが上図です。今回は5170×2585ピクセルの画像を使ったので2585×2585の解像度となっています。図左側が2880×1440で右側2585×2585を元にした画像です。最大に拡大したときボンヤリした画面がある程度スッキリします。もし元画像が5760×2880以上の解像度であればもう少し鮮明さに差が出たと思います。一方、使用する元画像が小さい場合…だいたいですが、幅が4000で高さが2000ピクセル以下になるとその差は殆ど感じられなくなると思いますので、Huginで出力したままの2:1の画像でも充分でしょう。

アスペクト比2:1の全方位画像を1:1にする

 Gimpや他のグラフィックソフトで幅だけ高さと同じ値にして処理しても良いですが、前回紹介した3DパノラマビューアーPanoSphereでも作成できます。PanoSphereで2:1の全方位画像を読み込んで[Save]タブをクリックして表示されるメニューで[Equi-square (Input for PanoSphereFlash)]をクリックして保存します。画像の大小に関わらず保存サイズは2880×2880固定のようです。

 保存する画像の質を変えたい場合は[Control]タブをクリックして表示されるメニューで[Save Quality]で設定します。デフォルトでは60になっています。数値が大きいほど画質は高くなりますが、出力されるファイルサイズは大きくなるので、アップロードするウェブサーバの負荷や規約を考慮に入れて設定してください。わからない場合はとりあえずデフォルトの60で出力しておきましょう。

パノラマFlashビューアーで3DパノラマをWebで公開する

  1. 基本編…HTMLファイルへの記述の仕方
  2. 応用編…角度、視野角、を変えてオートパンで表示する
  3. 応用編…globeモードで地球儀のようにグルグル回す
  4. 応用編…Bipolarモードで空飛ぶ虫の目で見た世界を

以下のソースの記述には、このブログサービスのスクリプト記述の無効化により一部表示されない部分があるので、タグに使われる<や>を全角の<や>で記述している部分があります。そのままコピペしたい場合は実際に3Dパノラマを表示させてブラウザのソース表示からコピーしてください。
以下のソースの記述では、スクロールバーが出て読みにくくならないようにブラウザの機能で折り返している部分があります。実際のソースでの改行ではない部分で改行されている箇所がありますのでご注意ください。また自動リンク機能が働いてhttpで始まる記述箇所がそのサイトにリンクしていますが気にしないでください。
詳細に関してはRyubin's Flash PanoramaのFAQページをご覧ください。

基本編…HTMLファイルへの記述の仕方

 画像(lateAutumn.jpg)とFlashファイル(PanoSphereFlash_v10.swf)とHTML(index.html)ファイルを同一フォルダに置きます。画像とHTMLファイル名は任意に変更してください。そしてHTMLファイルには最低限以下のように記述すればSphreモードの3Dパノラマを公開できます。




PanoSphereFlash









●実際に表示する→その1
 肝心なのは <object classid=… から始まって </object> までの記述部分です。既存のホームページに掲載するのであればそのHTMLファイルにこのobjectタグの部分を書き足します。paramタグとembedタグにはそれぞれ似たような記述がありますが、ブラウザーによって解釈可能なタグが異なるため2箇所にこのように記述しなければなりません。paramタグで指定しているのがインターネットエクスプローラー、embedがそれ以外のブラウザーになります。どちらか間違えるとブラウザーによって表示のされ方が異なったり、動作しないなどの原因になりますので注意してください。

 ふたつも設定するのは面倒くさいゾ!というい場合はjavascriptのみでブラウザにFlashを読み込ませても良いでしょう。javascriptを無効にしているユーザーは一部にすぎないので、javascriptが有効でないと表示できない旨の一文を添えておけば問題ないと思います。同梱されていたスクリプトファイルAC_RunActiveContent.jsを同一フォルダにコピーして以下のような記述をします。
またこのjavascriptの記述によってインターネットエクスプローラーで「コントロールをアクティブ化するには....」のメッセージが出なくなります。




PanoSphereFlash




<script language="javascript">
AC_FL_RunContent(
'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0',
'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '640',
'height', '480',
'movie', 'PanoSphereFlash_v10',
'FlashVars','img_path=lateAutumn.jpg'
); //end AC code


●実際に表示する→その2(表示自体は「その1」と全く変わりません)
 どんなパソコン環境でも閲覧できるようにしたり、厳格なXHTML準拠のページで間違いなく表示できるように、上の二つを合わせた下のような記述が一般的には望ましいといわれています。ソースコードが多いと初心者にとっては間違いを誘発しやすいので充分気をつけましょう。慣れないうちは上のふたつどちらかで練習してからがよいでしょう。



PanoSphereFlash




<script language="javascript">
AC_FL_RunContent(
'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0',
'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '640',
'height', '480',
'movie', 'PanoSphereFlash_v10',
'FlashVars','img_path=lateAutumn.jpg'
); //end AC code
<noscript>





</noscript>

●実際に表示する→その3(表示自体は「その1」と全く変わりません)

応用編…角度、視野角、を変えてオートパンで表示する

3Dパノラマの作例:Sphereモード いろいろな初期設定機能があるのでそれを使ってみます。初期表示時に「この構図で見せたい」「この大きさで見せたい」場合はこれらを設定します。ここでは初期表示時の視点の角度と画角を変えて、自動で回転させてみます。設定するパラメータは以下の通りです。

  • fov=80:視野角(画角)ちょっと広めの80に設定する。何も指定しないと60度です
  • pitch=30:垂直方向の角度、地球儀で見れば緯度です。あまり地面は表示させなくてもいいので、すこし上向きの30度を設定する。下向きにしたい場合は"-"マイナスを付けます。指定しない場合は0度です。
  • yaw=270:水平方向の角度、地球儀で見れば経度です。時計回りの角度で指定します。真っ赤な紅葉から表示させたいので270度に設定する
  • auto=0.1:滑らかな動きでパンしたいので0.1度に設定。反対方向(半時計回り)に回転させたい場合は"-"マイナスを付けます。
  • start=yes:起動時のオートパンの設定。yesに設定します。
  • smooth=yesピクセル補間の有無です。オートパンさせるとチカチカするのを抑えてくれます。yesを設定します。

上記の設定を"&"(アンドの文字)でつなげて画像ファイル名の後に記述します。この他にも上下方向に角度を変化させたり、その周期を設定するなどできます。詳しくはRyubin氏のサイトをご覧ください。

lateAutumn.jpg&fov=80&pitch=30&yaw=270&auto=0.1&start=yes&smooth=yes
これを「その3」の設定例に適用したのが以下の記述となります。



PanoSphereFlash




<script language="javascript">
AC_FL_RunContent(
'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0',
'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '640',
'height', '480',
'movie', 'PanoSphereFlash_v10',
'FlashVars','img_path=lateAutumn.jpg&fov=80&pitch=30&yaw=270&auto=0.1&start=yes&smooth=yes'
); //end AC code
</script>
<noscript>





</noscript>

●実際に表示する→その4

応用編…globeモードで地球儀のようにグルグル回す

3Dパノラマの作例:Globeモード 表示モードを変えるにはPanoSphereFlash上で右クリックして表示されるメニューから自由に選択して切り替え可能ですが、初期表示でglobeモードにしたい場合はパラメータにmodeを追加します。modeの設定は以下のようになっています。

  • mode=1:Sphereモード、設定しないとデフォルトでこのモードです。上のパターン全てがsphereモードとなります。
  • mode=2:Globeモード。
  • mode=3:Bipolarモード。

大きく表示させるために視野角を狭くしてfov=60として、回転を速めにauto=0.5としました。以下が設定例です。




PanoSphereFlash




<script language="javascript">
AC_FL_RunContent(
'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0',
'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '640',
'height', '480',
'movie', 'PanoSphereFlash_v10',
'FlashVars','img_path=lateAutumn.jpg&mode=2&fov=60&pitch=30&yaw=270&auto=0.5&start=yes&smooth=yes'
); //end AC code
</script>
<noscript>





</noscript>

●実際に表示する→Globeモード

応用編…Bipolarモードで空飛ぶ虫の目で見た世界を

3Dパノラマの作例:Bipolarモード Bipolarモードは視野角を広く表示させることで、ちょっと変わった風景を楽しめます。ほぼ全方向を見られる複眼をもったトンボはこんな風に世界を見ているのか…と思わせてくれます。他のモードでもそうですが、視野角を広げるほどオートパン処理にかかる負荷が大きくなるようです。おそらくCPUのキャッシュメモリが多いほど滑らかに表示されるのではないでしょうか。なので、低スペックのパソコンでも少しでも滑らかな動きになるように smooth=no としています。




PanoSphereFlash




<script language="javascript">
AC_FL_RunContent(
'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0',
'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'bgcolor', '#000000',
'width', '640',
'height', '480',
'movie', 'PanoSphereFlash_v10',
'FlashVars','img_path=lateAutumn.jpg&mode=3&fov=150&pitch=-30&yaw=270&auto=0.2&start=yes&smooth=no'
); //end AC code
</script>
<noscript>





</noscript>

●実際に表示する→Bipolarモード

おまけ…

3Dパノラマの作例:Bipolarモード respect to Arakawa Shusaku 荒川修作の作品「太陽の部屋」を彷彿とさせる?表示例→Bipolarモードその2
近づいているのに遠ざかっている、静止しているのに動いている、後を振り向けない前だけの世界…個の存在とその知覚を異次元に飛ばしてくれる、そんな空間を感じる…かもね

普通のデジカメで3Dパノラマを作成する(その2)


関連リンク:普通のデジカメで3Dパノラマを作成する(その1)
Huginで作成した全方位画像 今回はHuginを使って右図のようなアスペクト比2:1のEquirectangular(正距円筒)投影による全方位画像を作成し、ビューアー(PanoSphere_V11)を使って3Dパノラマ画像がちゃんと貼り合わされているかを確認します。
ここで使用している元画像をご希望の方はメールを下さればお送りいたします。800×600ピクセルの画像57枚をZIPでまとめて約8メガバイトあります。

Huginで全方位画像を作成する

 全方位画像とは左右前後上下の全ての角度で撮影した写真を、一枚の平面の画像に貼り合わせたものです。今までHuginで作ったパノラマ写真は、一部の方向を撮影した写真を貼り合わせたものでした。Huginで実際に全方向の写真を合成させると、上の画像のように一枚の写真として見るには違和感のあるものになってしまいます。この全方位画像は専用のビューアーで見ることでパノラマ写真として成立することになります。

画像を読み込んでプレビューさせる

Huginでの画像の読み込み Huginを起動して画像を読み込みます。余計な操作はしないというコンセプトで解説しますので、ここでは「Assistant」タブの[1.Load images...]ボタンをクリックして、表示された「画像を追加」画面から読み込ませます。

Huginの処理過程 画像を読み込み終えると一気にプレビューまでプロセスが走ります。
余談ですがちょっと重要なお話…、画像のサイズが大きかったり枚数が多いほど処理時間が長くなります。Core Duo 2GHzのCPUを登載したノートPCの場合ではプレビューするまで5〜6分かかりました。普段静かなノートパソコンも、CPUの稼動率100%が何分か連続するとCPUの温度が上昇して聴き慣れないファンの音でビックリするかもしれません。パソコンの熱を逃がす部分に本や布類などの排気を邪魔する物があると、熱がこもって最悪の場合は致命的な損傷に至ることがあります。パソコンがヒンヒンしはじめたら排熱に注意を払いましょう。高温は損傷に至らずともHDDやその他のデバイスの寿命を短くする原因にもなります。
またメモリーが足りないと、一枚の画像サイズがある程度大きくなると大量のスワップが発生して処理時間が数倍〜数十倍に長くなります。枚数の多い処理では1ギガバイトのメモリーは欲しいところです。最低でも512メガバイトは必須です。今回のように800×600程度なら256メガでもなんとかイケるでしょう。一方、一枚2000ピクセルを超えるような画像を扱う場合は、他の処理も考えると2ギガバイトは必要になります。メモリーが安価になって2ギガバイトが標準で登載されているパソコンも珍しくなく、大画像の3Dパノラマの作成もだれもが経験できる時代になったといえそうですね。古い型の低スペックのパソコンをお使いの方はご注意くださいませ。

Huginのプレビュー表示 処理が無事終了すればこのように表示されます。丁度メルカトル図法のように上下の端にいくにつれて像が引き伸ばされた画像が表示されます。

全方位画像を出力する

全方位画像を出力する さぁ、あとは画像ファイルを出力するだけです。[3.Create panorama..]ボタンをクリックします。枚数が多いのでここでも少々時間がかかります。

画像の出力に失敗したら

出力に失敗すると… 枚数の多い処理では、時としてエラーメッセージを出さずに失敗する場合があるようです。エクスプローラで出力ファイルを見るとファイルサイズが1キロバイトになっています。もちろん画像編集ソフトで開くことはできません。ログファイルが残らないのでなぜ失敗したか皆目見当がつきませんが、次のようなことをすると正常に出力するようです。

出力に失敗したときの対処方法 「スティッチング」タブを開いて、「パノラマのサイズ」の[最適なサイズを計算]ボタンをクリックしてサイズを再計算させます。再計算するとほとんどのケースでサイズが大きくなるようです。サイズの算出に問題があって出力に失敗したのでしょうか??
再計算したらボタンの右上にある[スティッチングの実行]ボタンをクリックしてもう一度出力処理をします。コントロールポイントが正常に付けられず途中で終了する場合を除き、私のケースでは大概これで正常に出力するようになります。
無事出力できたら、パノラマビューワーで表示させて貼り合わせにミスや不自然な部分がないかチェックします。

PanoSphereで3Dパノラマ画像を確認する

 PanoSphereはパソコンにインストールして使用する3Dパノラマビューアーソフトです。

PanoSphereのダウンロード

パノラマビューアーPanoSphereについて Ryubin's Flash Panoramaのサイトにアクセスして、ページの下方にあるリンク「High-resolution Spherical Panorama Photo Viewer...」をクリックします。表示されたPanoSphereご案内ページのメニュー「ダウンロード」をクリックしてダウンロードページを表示させ、図のように「ダウンロード」と書かれたリンクからダウンロードします。インストールや使い方に関してはそれぞれ「導入方法」「使用方法」に詳細に解説されています。

画像の確認

PanoSphereで出力した画像を確認する インストールが終了したら、出力した全方位画像を早速表示させてみます。あ、その前にHuginのデフォルトの出力ファイル形式はTIFですので、Gimpなどを使ってJPGに変換する必要がありますのでお忘れなく。
PanoSphereの[Open]タブをクリックして、出力した全方位画像ファイルを開きます。Sphereモードで開くので、そのままマウスをつかってグリグリと左右上下に動かして、貼り合わせに不自然な箇所がないかチェックします。特に上下端付近はこのようなビューアーを使わないと実際にちゃんと貼り合わされているか確認できないので念入りに見ておきましょう。カーソルが十字矢印のとき右クリックでワイド、左クリックでズームアップします。左右上下の回転はマウスをドラッグします。詳しくはhttp://ryubin.com/panosphere11/で。
ズームアップして見ると、微妙につながりのきれいでない部分もありますが、今回はこのレベルということで…

モードを変えて遊んでみる

BipolarモードRingモードGlobeモード
 [モード]タブでSphere以外のモードにしてグリグリ回したりして遊んでみるとトテモ楽しいです(^^)とくにBipolarモードでは歪曲させた平面の画像を見ているはずなのに、妙な立体感を感じてしまいます。これらはRyubin氏の作品であるウェブ公開用のFlashビューアーでも同様に表示させることができます。次回はウェブでの3Dパノラマの公開について解説したいと思います。

最後に

 PanoSphereは起動すると、回転やズームなどの操作をしない状態(アイドル状態)でもCPUを使うようです。デュアルコアプロセッサでは常に50%、シングルプロセッサの場合は100%近い使用率です。Huginの画像処理と同様に、ことにノートパソコンの場合はCPUの温度上昇に伴う排熱に気をつけましょう。

普通のデジカメで3Dパノラマを作成する(その1)


関連記事:普通のデジカメで3Dパノラマを作成する(その2)
特集記事「普通のデジカメで3Dパノラマを作成する」で使用しているソフトはHugin、FastStone Image Viewer、PanoSphere_V11、PanoSphereFlash_v10、GIMPです。
●Huginの関連記事→「パノラマ写真ツールHuginのインストール」「パノラマ画像作成ツールHuginの使い方
●FastStone Image Viewerの関連記事→「デジカメ時代の超便利な多目的画像ソフト
また、http://d.hatena.ne.jp/kadokura/20070903/p1GIMPを始めいろいろ関連記事の目次ですのでそれらを参考にしてください。PanoSphereについては(その1)から(その3)にて解説していきます。

3Dパノラマとは

3Dパノラマの概念図 一般的に3Dパノラマとは、画像が立体的に見えるパノラマという意味ではありません。写真を表示するビューアーで上下左右をマウスやキーボードを操作してグルリと360度見渡せる画像を3Dパノラマと称しています。例えば…擬似的な球の内面に全方向の画像を貼り付けて、その中心から上下左右を眺めるようなイメージです。そこに三次元の概念を用いているので「3D」という言葉が使われているのだと思います。それに対して、「360度パノラマ画像をFlashビューアーで表示させる」で解説したような画像表示方法は同じ360度でも平面的な画像を表示するものなので2Dパノラマと呼んでいます。

 3Dパノラマはホテル、旅館、マンション、建売住宅の豪華さアピールする目的で使用されたり、観光地のパノラミックな風景をプロモーションしたりその用途は様々です。普通の一枚の画像に比較して臨場感やリアリティが格段に優れていて、同質の同じ大きさであれば複数枚の写真を並べるよりも訴求率が高くなるといわれています。それは、動画の再生ボタン(リンク)がついているとついついクリックしてしまうのと同様に、3Dパノラマが表示してあると誰もが操作してしまうのではないでしょうか?方向を回転させると何が写っているのかという探究心も手伝って、予め提示されている平面画像よりも見たいという欲求を昂進させ、人の目に焼き付ける効果が増すのでしょう。それが結果的に訴求率の高さにつながるのかもしれません。…ここでは訴求率というよりも楽しさを追求したいと思います(^^)

 3Dパノラマといえば以前であればフィッシュアイレンズで撮影したり、特殊な全天撮影用の反射鏡を装着して撮影する必要があり、機材が高価でよほど趣味が嵩じなければ手を出せるしろものではありませんでした。しかしHuginのように高品質な画像の貼り合わせができるソフトがフリーで使用できるようになったので、わたしたちが持っている普通のデジカメでも、懐を全く気にすることなく手軽に3Dパノラマを楽しめるようになりました。

3Dパノラマ用写真を用意する

 天地左右を撮影する場合、雲一つ無い空だけが写ってるような写真が一枚でもあると、Huginでの貼り合わせ時にコントロールポイントを自動生成できずにうまく処理できません。隣りの画像とダブらせた部分に共通の目印になるようなモノが写っていないと、きれいにつなぎ合わせることができないのです。またコントラストが低くかったりぼやけて写っていると誤差が生じやすくなり、正常な処理が行われません。こういった場合は手作業でコントロールポイントを付けます。建物でもいいし雲でもOK、自動でパノラマ写真を作るためにはハッキリ写っている物体が各画像に必要になります。このような林の中だとたくさんの目印になるモノが多いので、広角端で画角が広くないカメラには最適なロケーションといえます。ただし風の強い日は木の枝が大きく揺れてしまってダメですが…。
パノラマの画像合成過程

 上図は今回作る全方位画像の元画像の一部を取り出したものです。撮影画像→歪曲変形→貼り合わせ→完成のプロセスをたどります。コントロールポイントがうまく検出できないときはエラーとなり、処理途中で終了してしまう場合もありす。重なりの部分にこれくらいたくさんの共通するモノ(上画像では右下の青で塗った部分)があると、コントロールポイントも検出し易く、貼り合わせも正確におこなわれオートのままですんなりパノラマ画像が作成できます。どうしても空だけとか単一色の平滑な壁だけしか写っていない写真がある場合は手作業でコントロールポイントを作成するか、思い切ってそれらを外して部分的な3Dパノラマにしても良いでしょう。それに関しては後ほど解説したいと思います。ここでは上下左右360度の3Dパノラマに使用する全方位画像を簡単に作成することを目指します。

撮影方法

3Dパノラマ用素材写真の撮り方 カメラの角度を少しずつずらしながら、天地左右をくまなく撮影するだけですからこれといって難しくはありません。このとき上下左右の隣りの写真と2〜3割程度ダブるように撮影するのがコツといえばコツです。手持ちで撮影すると特に上下方向のダブりに大きな誤差が生じやすくなるため、三脚を使って撮影することを強くお勧めします。図のように水平方向をぐるりと撮ったら、角度を上げてまた360度水平方向を撮ります。真上の位置が画面に入るまで撮るので何周かぐるぐる回ることになります。下方向も同様です。

 またカメラはフォーカスロック(焦点固定)およびAEロック(露出固定)した状態で撮影する必要があるので、それらのロックスイッチ機能があるデジカメでは撮影時に一番きれいに撮りたい位置でロックをオンにします。そうしないとシャッターボタンを押すたびに露出やフォーカスが変わってしまい、きれいなパノラマ写真を作ることができません。ロックスイッチが無い場合はシャッターボタンを半押しにしたまま指を離さずに角度を変えながら撮影します。途中で絶対に指を離さなずにグルリと撮影する必要があります。ほんのちょっと根気と我慢が必要です。

 なるべく画角の広いレンズの方が撮影する枚数が少なくて楽ちんです。普通のコンパクトデジカメでは広角側が38〜35ミリですが、もしワイドコンバータレンズをお持ちであれば装着して撮影しましょう。この例ではもっともポピュラーな広角35ミリのデジカメで撮影しました。AEロックなどのスイッチが無いので半押ししたまま撮った画像です。全部で撮影枚数が57枚となり、撮影には十数分間を要しました。屋外での撮影では日の出日の入りの時間帯や、曇りと晴れ間が短時間に変化するような天候では、撮影した画像の明るさが場所によって異なってしまうので要注意です。

撮影後の画像ファイルの処理

 デジカメの画像ファイルをあなたは普段どんなサイズで保存してますか?640×480程度の小さなサイズで保存してる方は少ないのではないでしょうか?

 普通のデジカメで3Dパノラマ用の写真を撮るときは枚数が多くなりがちで、Huginでつなぎ合わせたとき非常に大きなサイズになってしまいます。ですので逆にこの程度の小さなサイズで撮影しても充分です。しかし画面に写ってしまった「要らない部分」…人とか落ちているゴミとかセンスの悪い看板とか…を修正したいケースもあるので大きなサイズで撮って、修正後に3Dパノラマ用にサイズを一括縮小して使ったほうが良い場合があります。また、特に高い解像度で表示させたい場合などは2048×1536ピクセル以上で撮影しておくと良いでしょう。

 一括変換や一括修整には前回「デジカメ時代の超便利な多目的画像ソフト」で解説したFastStone Image Viewer が役立ちます。AEロックで撮影するため、肝心な部分の露出に不満がある場合や色調をレタッチしたい場合もあるので、これも一括修正できます。ここでは2048×1536ピクセルから800×600ピクセルに縮小して、且つ彩度を上げる調整を一括処理する方法を解説します。

画像の選択と一括処理画面

3Dパノラマに使用する写真をピックアップする 3Dパノラマに使用する画像を抜き出します。かなりの枚数にのぼるので一枚いちまい念入りにチェックするのは大変なのでFastStone Image Viewerでフルスクリーンにしながらざーっとチェックします。OKだったら使用する画像を[Shift]キーまたは[Ctrl]キーを押しながら選択します。選択状態のままで右クリックして表示されるメニューで[一括変換]をクリックして「一括変換 形式/名前」ウィンドウを表示させます。

一括変換処理設定画面 左側ペインは選択した画像のリストが表示されています。右側の「ソース」リストはフォルダ内の全画像リストが表示されています。この画面でも選択の変更ができます。入れ忘れていたり余計な画像があったら除外できます。

 一括してサイズを変えたりレタッチ処理した画像ファイルを保存するフォルダは[出力フォルダ]に設定します。同じフォルダ内の例えばsmallに保存する場合は“./small”と入力します。選択ボタンをクリックして設定することもできます。

ファイルの出力オプション設定 [出力形式]はJPGが良いでしょう。[設定]ボタンをクリックすると「形式出力オプション」ウィンドウが表示されます。ここでは[クオリティ]を調整するくらいで他はデフォルトのままでOKです。[クオリティ]は値が大きいほど再現性の高い画像になりますがファイルサイズ(容量)が大きくなります、値を小さくすると画像が荒れるもののサイズは小さくできます。[EXIF/PICTデータの保持]にチェックが入っているか確認してください。入っていなかったらチェックしておきます。

 サイズや色調を変える場合は[アドバンスオプションの使用]にチェックを入れて、表示される[アドバンスオプション]ボタンをクリックします。

画像サイズ変更

画像リサイズ設定 「アドバンスオプション」ウィンドウの[リサイズ]タブをクリック(デフォルトではこのタブを表示)して[新規幅][新規高さ]にサイズを指定します。右横にある<Pick a Standard Size>からもプルダウンでデジカメ画像の既存のサイズが選べます。[アスペクト比保持]以外はチェックを入れなくてOKです。

色調補正

色調補正設定 [調節]タブをクリックして彩度をアップする調整をします。この画面で[デザインとプレビュー]をクリックします。(色補正は全方位画像が出来上がってからでもOKです。イメージサイズの変更のついでにということで…)

プレビューを見ながら設定する方法 左上の2つのプレビューウィンドウは「後」の方が処理後のプレビューとなります。[彩度]のスライダーを直接ドラッグするか、マウスのスクロールボタンをクリクリしてプレビューウィンドウを見ながら彩度の調整をします。時々[プレビューの制限]ボタンをクリックして原寸大で彩度の調子を見ます。また、他の画像もチェックするために、左ペインの「入力リスト」の画像名をクリックして一通りチェックすると良いでしょう。設定が終ったら[閉じる]ボタンをクリックします。
設定が終ったら「アドバンスオプション」ウィンドウで[OK]ボタンをクリックします。

一括処理実行

一括処理実行 [一括変換 形式/名前]ウィンドウで[開始]ボタンをクリックすると処理が開始されますが、[出力フォルダ]で入力したフォルダがない場合はこのようなアラートが表示されます。[OK]ボタンをクリックしてください。

一括処理プロセス表示画面 処理する画像のファイルサイズが大きかったり、処理内容が多岐にわたっていると処理時間が長くなります。スペックの低いパソコンではしばらく待たされることがあるので、大量のファイルを一括処理するときは前もって少ない数でどれくらい時間がかかるのか調べておくと良いでしょう。メモリーが足りなくなって、ディスクスワップ状態になると余計時間がかかることになります。
 無事に変換されていれば元画像フォルダ内のsmallフォルダ(ここでの場合)に縮小&彩度アップした画像が保存されます。