360度パノラマ写真をループできるように出力する方法

質問

こんにちわ、
360度のパノラマ写真というと、
http://blogimg.goo.ne.jp/user_image/23/74/ff1686d4fa3531c91ab5f89d08be1e82.jpg
こういったグルッと見回した写真のですが、
なんとかこういった写真を作るまではいけたのですけど、
あくまでこれは1枚の"画像"なので、左右がループしていません。
この360度画像をWeb上にアップし、閲覧者にループして見せられるようにするにはどうしたらいいのでしょうか？

↓こういった感じです。
http://www.panoramas.dk/fullscreen3/f44_niagara.html
http://www.360do.com/sample.html
※縦にループまではしなくていいかな…と思ってます。
　左右だけで十分です。

学校のPCに
Macromedia Flash 8やFireworks 8、
Adobe Illustrator CS2、Photoshop CS2
など、ある程度グラフィックソフトがそろっているみたいなので、
それが活用できれば、と思っているのですが…。

＃ある程度調べ、　QuickTime VR Authoring Studioというソフトがあればなんとかなりそうだったのですが
　かなり古いソフトで、しかもマッキントッシュ用なので個人的には難しいです…。

回答No.2

N_A_O

下記参照。
http://ww4.tiki.ne.jp/~mmurakami/setoy/

回答No.1

BlurFiltan

それでは Flash で行きますか？

本当は，
Flash内にムービークリップなどを作り込んで行って，
そのように動かせるような構造自体を作った上で，
ActionScript と言う言語でプログラムを組んで動かして行く物です。

しかし，
ご質問の感じでは，動かせるような構造を作ること自体が困難であるように思いますし，
構造を作るための説明をするだけでも気が遠くなりますから，
写真素材画像の作成以外は，ほぼ 100％ ActionScript で動かす方法を書きます。
右も左もわからない状態の方の場合は，ActionScript のみでする方が簡単です。

まず，任意のフォルダに，
書かれていらっしゃる URL の横長いパノラマ写真を保存し，
すみませんが，パノラマ写真を Photoshop で 横幅 2880px 以下にリサイズしてください。
理由↓
http://www.google.co.jp/search?hl=ja&q=2880px+Flash&lr=lang_ja

そして，とりあえず，「panorama.jpg」 というファイル名にして保存しなおしてください。
この 「panorama.jpg」 を外部ファイルとして SWF からロード表示させるしくみにします。

横幅 2880px 以下にリサイズした 「panorama.jpg」 が用意できましたら，
Flash 8 を起動させて新規ドキュメントを作成し，
「panorama.jpg」 と同じフォルダに任意のファイル名で保存します。

そして，
ステージの上にある，タイムラインの レイヤー1 の フレーム1 の空白キーフレームを選択して，
ステージの下にあるアクションパネルを表示させます。

そして，アクションパネルに次の ===== 内のスクリプトコードを全てコピー＆ペーストします。

===============================================
// パノラマ写真のパス及びファイル名を指定 ★
photo = "./panorama.jpg";
// パノラマ写真を動かすスピードの設定 ★
speed = 20;
//------
// カウント用変数 cnt の初期化
cnt = 0;
// フラグ用変数 flg1 と flg2 の初期化（ブール値の false）
flg1 = false;
flg2 = false;
//------
// 親ムービークリップを作成
_root.createEmptyMovieClip("oya_mc", 0);
// 親ムービークリップ内に子ムービークリップを２つ作成
_root.oya_mc.createEmptyMovieClip("ko1_mc", 0);
_root.oya_mc.createEmptyMovieClip("ko2_mc", 1);
//------
// MovieClipLoaderクラスのインスタンス mcl を作成
mcl = new MovieClipLoader();
// _root 自体をリスナーオブジェクトとして登録
mcl.addListener(this);
// 指定写真を ko1_mc にロード
mcl.loadClip(photo, _root.oya_mc.ko1_mc);
//------
// ロード＆表示されたときの動作を定義
function onLoadInit(myMC) {
//もし 変数 cnt の値が 0 であれば
if (cnt == 0) {
// ko2_mc の座標を決定
_root.oya_mc.ko2_mc._x = myMC._width;
// 指定写真を ko2_mc にロード
mcl.loadClip(photo, _root.oya_mc.ko2_mc);
// カウント用変数の値を 1 加算
cnt++;
} else {
// フラグ用変数 flg1 を true にする
flg1 = true;
}
}
//
//---------
//
// マウス監視用リスナーオブジェクト msl の作成
msｌ = new Object();
// マウスダウン時の動作を定義
msｌ.onMouseDown = function() {
// フラグ用変数 flg2 を true にする
flg2 = true;
// マウスダウン時のマウスのx座標を保存
msx = _root._xmouse;
};
// マウスアップ時の動作を定義
msｌ.onMouseUp = function() {
// フラグ用変数 flg2 を false にする
flg2 = false;
};
// msl を Mouseクラスのリスナーに登録
Mouse.addListener(msｌ);
//
//---------
//
// １フレーム進時間毎に随時実行
_root.oya_mc.onEnterFrame = function() {
// フラグ用変数 flg1，flg2 が共に true であった場合
if (flg1 && flg2) {
// マウスの座標によって変数 spd の値を変える
this.spd = speed*(msx-_root._xmouse)/(Stage.width/2);
// 実際の移動
this._x += this.spd;
// 左右の限界位置に達したとき座標を折りかえす
if (this._x<=-this._width+Stage.width) {
this._x += -this._width/2+Stage.width+this._width-Stage.width;
} else if (this._x>=0) {
this._x += -this._width/2;
}
}
};
===============================================

そして，
「制御」→「ムービープレビュー」してもらうと，動作確認ができます。
また，
「ファイル」→「パブリッシュ」でドキュメントを保存したフォルダに SWF と HTML が作成されると思いますから，
一応以上で完成です。

ステージの大きさは，ActionScript では指定できません。
「修正」→「ドキュメント」より，ドキュメントプロパティで適当に設定してください。
また，
動きをなめかにしたい場合は，フレームレート を 20 fps 以上くらいにしてください。

そして，
スクリプト中の★のついた最初の２行の値は必要に応じて変えてください。

　// パノラマ写真のパス及びファイル名を指定 ★
　photo = "./panorama.jpg";

このパスは，
SWF を HTML に貼り付けた場合，SWFからのパスではなく，HTMLからのパスになります。
したがって SWF と JPEG と HTML を違うフォルダに保存する場合は，
パスの変更に気をつけてください。

Flash は今回使ってみるだけということでしたら，
以下は無視してくださってかまいません。

/////////////////////////////////////////////////////////

次の URL は Adobe Flash 使用のためのサイトではなく，
他の Flash 作成ソフト（Suzuka）を使うためのサイトですが，
画像を無限ループ移動させる原理は同じです。
参考URL↓
http://suzupara.iinaa.net/photo.html

原理をビジュアル的に知りたい場合は，上のページの下の方を参考にしてみてください。
この原理を利用しています。
また，今回書いたスクリプトの 最後の数行 は，
上のページと同じコードを使用させていただいています。

※ ダウンロードできるファイルは Adobe Flash 用ファイルではないので
　 Flash8 では使用できません。
　 しかし，Adobe Flash がご自宅にないのであれば，
　 最初から上記サイトのフリーソフト Suzuka を使う手もありますよ。

もし今後も Flash にとり組み続けたいと思われる場合の話ですが，
Adobe Flash でも，普通は上のページのような感じで構造を作り込む修行を繰り返しします。

ものを作り込む修行をすると，
空想上のイメージだけで時間的空間的な構造が作り込めるようにもなります。
すると，構造を具体化する ActionScript も考えられるようになって，
ある程度であれば ActionScript だけでも，ものを配置したり動かすことができるようにもなります。

今回は構造を作り込むことに関する説明が困難であるため，ActionScript のみで作成しただけです。
普通の場合は，当然 ActionScript だけでする必要は全くありません。
実際に作り込んだものの方が，さらに細かい動きや複雑な動作も作成することが可能となります。

Adobe Flash にとり組む場合は，
コピペでする方法ではなく，基礎的な簡単な本を買って，
ぜひ，「ものづくり」や「ActionScriptを使わないアニメーション」から始めてください。
結局，基礎的なことを積み上げて行くことが，上達への早道になります。

※ Suzukaには書籍などはおそらく存在していません。
　 サイトの情報を参考に自己鍛錬あるのみです。
　 また上記スクリプトは，
　 Flash 8 では動作検証済みですが，Suzuka での動作検証は行っていません。