Skip To Content

ストーリー マップ ツアーの作成

ストーリー マップ ツアーは、最も人気のある ストーリー マップ アプリの 1 つで、このレッスンで使用します。ストーリー マップ ツアーを作成するには、まず使用するメディア (写真やビデオ) を収集し、整理する必要があります。

写真には、任意のサイズと形状の画像を使用できますが、横方向 (横長の画像) をお勧めします。マップ ツアーを参照しているユーザーの注意が形状の異なる画像によってそらされないように、すべての画像のサイズと横縦比を同じにすることが望ましいです。推奨される画像の横縦比は 4:3 です。

画像の保存には、いくつかの選択肢があります。Flickr または Google+ に保存されている画像を使用できます。マップ ツアーはこれらのサービスが写真の保存時に行う最適化を活用します。このため、どのようなサイズの画像もアップロード可能で、ストーリー内にすばやく読み込むことができます。マップ ツアーはさらに、画像内のジオタグ情報を自動的に読み取って画像をマップ上に配置し、画像とともに保存されているタイトルとキャプション テキストを使用します。画像に位置情報がない場合、マップ ツアー ビルダーを使用してマップ位置を対話形式で指定できます。

このジオタグ付きの写真を使用して、ArcGIS Online で素早くこのようなストーリー マップ ツアーにまとめることができます。

このレッスンでは、画像と地理情報を組み合わせて、独自のマップ ツアーを作成します。ArcGIS Online で利用可能なフィーチャを使用してストーリーを伝えるためにジオタグ画像を使用する方法について、以下の手順で示します。レッスンでは、ストランドで撮影された一連の写真をサンプルとして使用します。ストランドは、3 マイルに渡るビーチで、文化と美容で有名なロサンゼルス郡に位置しています。興味のあるテーマを何でも素材にして独自のマップ ツアーを作成してみましょう。

自分が所有している写真を使用することをお勧めしますが、ジオタグ付き画像にアクセスできない場合は、Flickr 上の画像コレクションを使用して、これらの手順を再現できます。自分が所有している写真を使用していない場合は、「ツアーの構築」に進みます。

画像のアップロード

Flickr や他のオンライン ホスト環境に選択した写真をアップロードし、それらをストーリーに構成するのは非常に簡単です。写真がジオタグ付きでない場合、住所を使用してサイトを特定し、マップでアイコンを移動させて手動で調整を行うことができます。ストーリーの構築は比較的簡単で時間もかかりませんが、場所の検索とテキストの書き込みには時間がかかります。

  1. Flickr アカウントにサイン インします。
    注意:

    Flickr アカウントも独自のジオタグ付き写真も持っていない場合は、Flickr 上に esrilearn アカウントで提供された写真セットを利用できます。

  2. 自分の Flickr アカウントにサイン インした場合は、フォトストリームに写真をアップロードして、新しいアルバムを作成します
    注意:

    アルバム内の最初の写真はイントロ画像と呼ばれます。この画像は、アプリケーションを初めて開いたときに表示される画像として指定されています。

ツアーの構築

  1. Esri ストーリー マップ Web サイトに移動します。
  2. ページの上部にある [アプリ] をクリックします。
  3. [場所に基づく一連の写真またはビデオ][ストーリー マップ ツアー] 見出しで、[構築] をクリックします。

    マップ ツアーの構築

  4. プロンプトが表示されたら、ArcGIS アカウントにサイン インして、[マップ ツアー ビルダーに進む] をクリックします。
    注意:

    ArcGIS アカウントを持っていない場合は、無料の個人向けプランのアカウントにサイン アップできます。

    [ようこそ] ウィンドウで、画像 (またはビデオ) のソースを選択するように求められます。マップ ツアーは、画像またはビデオ、あるいは画像とビデオの両方を使用できます。ビルダーは YouTube アカウントに保存されたビデオに直接アクセスできます。つまり、YouTube、Vimeo などにある個別のビデオへの URL を指定できます。

  5. [Flickr] ボタン (あるいは、メディアを保存した場所によっては、[YouTube] ボタン) をクリックします。

    マップ ツアー ビルダーへようこそ

  6. Flickr を例に使用する場合、ユーザー名ボックスに、ユーザー名として「LearnArcGIS」と入力して、[検索] ボタンをクリックします。
    注意:

    公開者権限を持つ ArcGIS サブスクリプション アカウントを使用している場合は、画像をコンピューターからマップ ツアー ビルダーに直接アップロードできるオプションもあります。この場合、画像はマップとともにクラウド内に保存されます。このオプションは、画像がオンラインにない場合や、パブリックにアクセス可能にしたくない画像を使用して組織内部のみで共有するマップ ツアーを作成する場合に便利です。

  7. アカウントの検出後、アルバム [A Winter Day on The Strand (37)] を選択して [インポート] をクリックします。

    写真セットの選択

    (上記で参照されているストランドの写真のように) 写真に有効な位置情報が含まれている場合、それらの写真は自動的にマップ上に位置が特定され、2 番目のタブにリストされます。

    画像の選択と配置

    注意:

    Flickr を使用する場合、デフォルトでは、写真のアップロード時に位置情報 (EXIF メタデータの一部) は格納されません。位置情報の格納を許可するには、アカウントのプライバシー設定を使用します。この設定を変更せずに、以前に写真をインポートした場合は、それらの写真を削除してから再びアップロードする必要があります。

    位置が特定されなかった写真がある場合、対話型ツールにあるマップを使用してその写真の位置を決定することもできます。

  8. [インポート] ボタンをクリックして終了します。

    対話型のユーザー インターフェイスが表示されます。これを使用して、テキストの入力、表示範囲やズーム レベルの設定、および一般ユーザーとの最終的なマップの共有を行うことができます。

    画像読み込み後の最初の画面

  9. 左側のウィンドウで、[設定] をクリックします。
  10. [設定] ウィンドウの [レイアウト] タブで、[サイド パネル] がストーリー マップのレイアウト タイプとして選択されていることを確認します。

    [サイド パネル] レイアウトの選択

    注意:

    [レイアウト] タブでは、ツアーに使用するレイアウトを選択できます。パネル レイアウトまたは統合レイアウトを選択した場合、マップ ツアーにはオプションのサブタイトルが表示され、ビルダーで、ヘッダー内のそのサブタイトルを編集できます。サイドパネル レイアウトとは異なり、これらの 2 つのレイアウトにはカバー ページがありませんが、[整理] ダイアログに、マップ ツアー内の最初のポイントが導入部になることを指定するオプションがあり、このポイントはマップ上に地理的ポイントとして表示されません。このオプションは、ユーザーが移動を開始する前に、ツアーに関する追加の説明文を提供する優れた方法です。

  11. 必要に応じて、[適用] をクリックします。

説明文の記載

今度は、メインのアプリケーションと各写真についてタイトルとキャプションを作成します。実際には、これは最も時間のかかる作業の 1 つです。また、最も重要な作業でもあります。というのも、これはあなた自身のストーリーだからです。時間をかけ、簡潔に記載してください。また、記載内容をチェックする編集者を見つけてください。情報を公開しようとしていることを覚えておいてください。ストランドの例を使用すると、作業を省略して、このテキスト ファイルから必要なテキストをコピーして貼り付けることができます。

  1. 必要に応じて、メイン タイトルの横にある鉛筆アイコンをクリックして、「A Winter Day on The Strand」(またはお好みの名称) と入力します。

    タイトルと説明の編集

  2. [イントロ画像] で、タイトルを「Intro Image」に更新します。
  3. 画像の説明で、次のテキストをコピーして貼り付けます。

    マンハッタン ビーチやハモサ ビーチといったロサンゼルス郡の海岸沿いのビーチ コミュニティは、シンプルに「ストランド」と呼ばれています。ここには、全長 3 マイルに及ぶウォーキングやバイキング トレイルがあり、西海岸で最も美しいビーチや高級な不動産エリアを横切るように延びています。夏には、あらゆるもので溢れかえりますが、冬になると禅のようにひっそりとした場所になります。

  4. ベースマップを [道路地図] に変更します。

    [ベースマップの変更] メニュー

    [道路地図] は、拡大縮尺しても豊富な詳細情報が表示されるため、市街地に対して効果的な選択です。別のベースマップを試してみて、ご自身の好みにより適したものがあれば、そちらを選択してください。

  5. [+] ツールを使用して、位置の範囲がマップに全体表示されるまでビーチ沿いの都市をマップ上でズームします。

    ビーチ沿いの都市をズーム

    注意:

    ビルダーの左側にある [整理] ボタンをクリックして、ポイントを管理できます。マップ ツアー内の最初のポイントがツアーのカバー ページを定義することを指定するオプションも提供されています。このオプションを使用した場合、カバー ページ画像はマップ上の地理的ポイントとして表示されません。カバー ページは、マップ ツアー ビルダーには表示されませんが、[ストーリーの表示] ボタンを押して、ツアー内での表示をプレビューすることはできます。このボタンは、ツアーを保存すると有効になります。そのボタンを押すと、新しいブラウザーでツアーが開くので、ユーザーへの表示内容を確認できます。

  6. 左側のウィンドウで、[ツアー ポイントの整理とカバー ページの追加] をクリックします。
  7. [カバー ページとして最初のポイントを使用] をオンにします。

    カルーセルから除外

  8. [順序および非表示ポイントをリセット] および [適用] をクリックします。
  9. 左側のウィンドウで、[保存] をクリックします。

    [ツアーが保存されました] というメッセージと、ストーリーを編集したりエラーを確認できる [マイ ストーリー] へのリンクが表示されます ([ストーリー マップ] ページから [マイ ストーリー] に移動することもできます)。

    ツアーが保存されました

    また、ArcGIS Online のコンテンツからこの Web アプリケーションを取得することもできます。

    [マイ コンテンツ] タブに表示されるアプリケーション

  10. コンテンツ ページの[マイ コンテンツ] タブで、Web マッピング アプリケーション [A Winter Day on The Strand] をクリックします。
  11. サムネイル画像をクリックするか、[アプリケーションの表示] をクリックして、アプリケーションを開きます

    アプリケーションの表示

    ここで、いくつかの問題があることがわかります。スライドのタイトルは未処理の画像名を示しています。また、一部のキャプションが存在していません。これらの問題に対処し、他にいくつかの変更を行ってみましょう。

  12. [編集] ボタンをクリックします。

    ビルダー モード ボタン

  13. 左側のウィンドウで、[設定] ボタンをクリックします。
  14. [範囲] タブをクリックします。

    ここでは、アプリケーションが初めて読み込まれたときの初期のマップ範囲を設定できます。

  15. 初期のマップ範囲にすべてのツアー ポイントが含まれていることを確認します。必要に応じて、[新しい範囲の描画] をクリックして、マンハッタン ビーチとハモサ ビーチを中心としてその周辺にボックスを描画します。

    ビーチ沿いの都市の範囲の描画

  16. [適用] をクリックします。
  17. [設定] ボタンをクリックして、[設定] ダイアログ ボックスをもう一度開きます。
  18. [データ] タブをクリックして、画像メタデータから写真名とキャプションを更新します。[名前][名前] を選択し、[キャプション][説明] を選択します。

    写真の名前とキャプションの選択
    注意:

    テキストに追加の書式設定やハイパーリンクを指定したい場合は、マップ ツアーのポイントのキャプションに使用するテキストに HTML タグを含めることができます。たとえば、各キャプションに写真の著作権を斜体で含めることができます。

    ビルダーでは、写真やビデオの名前とキャプションを、マップ ツアーに直接含めることができます。または、事前にすべてを準備しておく場合は、マップ ツアーを定義する名前、キャプション、位置、メディアの URL を含むスプレッドシートを作成しておき、そのスプレッドシートを CSV ファイルとしてマップ ツアー ビルダーにインポートすることができます。ビルダーでは、このスプレッドシートの作成に使用できるテンプレートをダウンロードできます。

  19. [ズーム レベル] タブをクリックし、[ズーム レベル][1:5K (level 17)] に変更します。

    ズーム レベルの設定

  20. [適用] をクリックします。
  21. 変更内容を保存して、範囲とズーム レベルをテストします。

    場合によっては、データとストーリーに適した組み合わせを見つけるために、いろいろな範囲とズーム レベルを試してみる必要があります。次のステップでは、タイトルを整え、各写真のキャプションを作成します。前にも述べたように、これは、手間がかかりますが、極めて重要な作業の 1 つです。ストランドの例を使用し、手順を省略するためにテキストをコピーして貼り付けるには、このテキスト ファイルをご参照ください。

    注意:

    適切な名前とキャプションを持つ画像もありますが、多くの画像では更新が必要なため、必要に応じて更新してください。

    完成したストーリー マップ

  22. テキストの編集が完了したら、変更内容を保存します。
  23. 最後の手順として、ストーリー マップを共有します。

これで作業は終了です。これで、このストーリー マップ ツアーを再作成できるだけでなく、よりよい独自のマップ ツアーを作成できるようになっているはずです。インスピレーションを得るには、ストーリー マップ ツアー ギャラリーにあるいくつかのサンプルをご覧になってください。このギャラリーには、ストーリー マップ ツアー アプリの使用方法や、効果的なデザイン パターンやベスト プラクティスの作成例が示されています。ギャラリーは題材や業界によってフィルターをかけたり、キーワードで検索したりできます。自分の関心や題材とする領域と一致するサンプルが見つかるかどうか確認してみてください。そして、マップ ツアーで情報を伝達する方法や、このアプリで効果的にストーリーを伝えるために最適なアプローチ方法に関する感覚を身に付けてください。

次のレッスンでは、カリフォルニア州南部の別の都市であるサンディエゴにユーザーを迎えるためのストーリー マップ カスケードを構築します。