▼サンプルツアーを見てみる。
https://smapano.com/pano?flag=3&projectid=189&locale=ja&code=773,770,771,772&start_scene=773
このサンプルツアーは、カフェの4か所のポイントで撮影したパノラマ画像を使用し、「外観を起点に店内1→店内2→店内3→外観へ戻る」構成です。
「サンプルツアー使用データ」をダウンロードして、360度パノラマツアーを作ってみましょう。
以下のような手順でサンプルツアーを作成します。
1. ログイン
2. パノラマ画像（または平面画像）をアップロード
3. 各パノラマの編集
3 – 1. ファーストビューの設定詳細はこちら
3 – 2. パノラマ名を設定する詳細はこちら
3 – 3. ネイダーパッチの設定詳細はこちら
4. 「埋め込み」でポップアップ画像を表示させる
5. 「埋め込み」で他のパノラマをつなげる（リンクさせる）
登録したユーザーID（メールアドレス）とパスワードを入力して、ログインします。
「Facebookアカウント、Twitterアカウント、Google+アカウント」で登録していただいた場合、SNSアイコンからのログインとなります。
マイパノラマ画面の「＋作成」のボタンをクリックします。
 |
「画像アップロード」ボタンをクリックして、パノラマ画像のアップロードをします。
詳しい設定方法はこちらをご覧ください。
 |
パノラマ図か平面図を選択します。ここでは「パノラマ図」を選択しましょう。
 |
パノラマ図の場合、画角を選択します。ここでは「360」を選択しましょう。
  |
任意のグループ名をつけます。ツアーに使用する複数のパノラマを「グループ」でまとめておきます。
パノラマ公開を選択し、「確認」ボタンをクリックすると確認画面になります。
※無料版は１グループのみの登録となります。
 |
確認画面に表示されたパノラマ画像をドラッグすると、360度画像が確認できます。
保存ボタンをクリックするとSmaPanoにパノラマ画像が保存され、編集が可能となります。
この手順を繰り返して、パノラマ画像を追加していきます。
 |
以下の３つの設定を行います。
3 – 1. ファーストビューの設定詳細はこちら
3 – 2. パノラマ名を設定する詳細はこちら
3 – 3. ネイダーパッチの設定詳細はこちら
上記の設定が完了したら、右下の「新規作成」をクリックして、2. パノラマ画像（または平面画像）をアップロードへ戻り、同様な流れで一通りパノラマ画像データをアップロードして設定を完了させます。
 |
なお２枚目以降のパノラマ画像をアップロードする際、既存のグループ名から先ほど新規に作成したグループ名を選択します。
全てのパノラマ画像で 3. 各パノラマの編集が完了したら、 次の設定へ進みます。
マイパノラマ画面に戻り、パノラマ画像のサムネイルにカーソルを合わせると、編集項目の表示に切り替わります。「埋め込み」ボタンをクリックして編集を始めます。
 |
「＋新規作成」ボタンをクリックして、パノラマ上にアイコンを設置します。
画像埋め込みの詳細については、こちらをご覧ください。
 |
アイコンを選択したら、パノラマ上のアイコンをドラッグして、設置したい場所へ移動させます。アイコンは自由に選択できます。
※オリジナルアイコン、アイコンのサイズ変更は有料版の機能となります。
 |
埋め込みの種類で「画像」を選択し、表示したい画像をアップロードします。
 |
アイコンにカーソルを合わせた際に表示される名称（アイコン名）をつけます。
次に、ここでは「アイコン表示をする」にチェックを入れます。「保存」をクリックすると、プレビューで確認できます。
 |
カーソルを合わせるとこのように「アイコン名」が表示されます。
 |
プレビューでアイコンをクリックすると、ポップアップで画像が表示されます。
表示された画像をクリックすると閉じます。
 |
「埋め込み」機能の「つなげる」の設定で、パノラマを行ったり来たりすることができます。作業の前に、マイパノラマ画面にて、使用する複数のパノラマをアップロードしておくと、作業がスムーズに行えます。
「埋め込み」ボタンをクリックすると、パノラマ画像に設置済みのアイコン情報が表示されます。「＋新規作成」をクリックして、「つなげる」設定をスタートしましょう。
 |
店舗入口に、店内に向けて矢印アイコンを設置します。
矢印アイコンを選択すると、パノラマ画像上に矢印アイコンが表示されます。矢印アイコンをドラッグして、お好みの位置に配置しましょう。
 |
「埋め込み」の設定で「つなげる」を選択します。矢印の方向も設定できます。
 |
移動先のパノラマ画像を指定します。
カーソルを合わせると表示される「アイコン名」を設定します。
「保存」ボタンをクリックして、次画面のプレビューで確認してみましょう。
 |
他のパノラマ画像も同様に「つなげる」設定をして、サンプルツアーの完成です。
サンプルツアーにマップを配置することができます。
360度パノラマツアーを作ってみよう フロアマップの配置